@charset "UTF-8";

/*!
Template: cocoon-master
Theme Name: Minagof
Description: ドッグサロンMinagofのテーマ
Author: ドッグサロンMinagof
Version: 1.0
*/





/* ====================================

	-------------------------
		Structure
	-------------------------

	1. General
	2. Header
	3. Main
	4. Footer
	5. Page
		0.0 
		0.0 
		0.0 
		0.0 
		0.0 
		0.0 
		0.0  
	6. Contact
	7. Blog
	8. Other
	9. Cocoonの基礎デザイン調整
	10. 期間限定・イベント

==================================== */





/*====================================

     0. 大見出し     //////////////////////
	
====================================*/

	

/*     中見出し     /////
====================================*/

/*=== 小見出し ===*/

/*= 小小見出し =*/

/* ワンポイント */






/*====================================

     1. General     ///////////////////////
	
====================================*/



/*     画面移動時にフェードイン     /////
====================================*/
body {
	animation: fadeIn 1s ease 0s 1 normal;
	-webkit-animation: fadeIn 1s ease 0s 1 normal;
}
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}



/*    コンテンツブロック　 padding調整     /////
====================================*/

/*=== ページビルダー　列　上部と下部のスペース ===*/
.content-block {
	padding: 40px 0px;
}
@media only screen and (max-width: 750px) {
	.content-block {
	padding: 15px 0;
	}
}

/*=== ページビルダー　列の内部　連続使用時の下部スペース ===*/
.so-panel {
	margin-bottom: 35px !important;
}
.so-panel:last-child {
	margin-bottom: 0px !important;
}
@media only screen and (max-width: 750px) {
	.so-panel {
	margin-bottom: 25px !important;
	}
}

/*    個別ページ　上部スペースの調整     /////
====================================*/
.page-id-29 .main,
.page-id-35 .main,
.page-id-31 .main,
.page-id-33 .main,
.page-id-37 .main {
    padding-top: 15px;
}
@media only screen and (max-width: 768px) {
    .page-id-29 .main,
    .page-id-35 .main,
    .page-id-31 .main,
    .page-id-33 .main,
    .page-id-37 .main {
    padding-top: 0px;
    }
}

/*    h1　タイトルデザイン　各ページ     /////
====================================*/

/*=== h1 ===*/
.page-id-29 .article h1,
.page-id-35 .article h1,
.page-id-31 .article h1,
.page-id-33 .article h1,
.page-id-37 .article h1 {
    line-height: 1.4;
    color: #ff938b;
    text-align: center;
    font-size: 45px;
    margin: 15px 0 30px;
}
.page-id-29 .article h1:before,
.page-id-35 .article h1:before,
.page-id-31 .article h1:before,
.page-id-33 .article h1:before,
.page-id-37 .article h1:before {
    font-family: "FontAwesome";
    content: "\f1b0";
    font-size: 1em;
    left: 0;
    top: 0;
    color: #ff938b; 
}
.page-id-29 .article h1:after,
.page-id-35 .article h1:after,
.page-id-31 .article h1:after,
.page-id-33 .article h1:after,
.page-id-37 .article h1:after {
    font-family: "FontAwesome";
    content: "\f1b0";
    font-size: 1em;
    top: 0;
    color: #ff938b; 
}
@media only screen and (max-width: 768px) {
    .page-id-29 .article h1,
    .page-id-35 .article h1,
    .page-id-31 .article h1,
    .page-id-33 .article h1,
    .page-id-37 .article h1 {
    font-size: 30px;
    padding-left: 0px;
    padding-right: 0px;
    margin: 0px 20px;
    }
}



/*    赤文字の注意書き     /////
====================================*/

.note {
    font-size: 0.8em;
	color: #FA514B;
}
.note:before {
	content:"※";
    margin-right: 5px;
}



/*    共通タイトルデザイン     /////
====================================*/

.com_title_h2-1 {

}
.com_title_h2-1 h2 {
    background: #a8d4ff !important;
    box-shadow: 0px 0px 0px 5px #a8d4ff;
    border-top: dashed 2px white;
    border-bottom: dashed 2px white;
    padding: 0.6em 0em !important;
    color: #7b6459;
    font-size: 25px;
}
@media only screen and (max-width: 750px) {
    .com_title_h2-1 h2 {
    font-size: 20px;
    }
}




/*====================================

     2. Header     ////////////////////////
	
====================================*/

/*     ヘッダーロゴのサイズ調整     /////
====================================*/
@media screen and (max-width: 768px) {
	.logo-header img {
    width: 85%;
	}
	.logo-image {
    padding: 1px 0;
	}
}

/*     ヘッダー画像の下に波模様デザインを追加     /////
====================================*/
.header {
    position: relative;
}
.header:after {
    content: '';
    width: 100%;
    height: 4px;
    background: url(https://minagof.com/wp-content/uploads/2019/05/wave_bottom.png) repeat-x 0 0;
    background-size: 26px 4px;
    position: absolute;
    bottom: 0px;
}







/*====================================

     3. Main     //////////////////////////
	
====================================*/



/*     トップページ　h1を非表示     /////
====================================*/

.page-id-25 .article h1 {
    display: none;
}



/*     トップページ　h2      /////
====================================*/

.top_title_h2 {

}
.top_title_h2 h2 {
    font-size: 24px;
    color: #333333;
    text-align: left !important;
	font-weight: 700;
}
.top_title_h2 i {
    padding: 10px;
    background-color: #E0ECF8;
    color: #0089D8;
    margin-right: 15px;
    border-radius: 50%;
}
@media screen and (max-width: 768px) {
	.top_title_h2 {

	}
	.top_title_h2 h2 {
	font-size: 20px;
	}
}



/*     トップページ上部　WELCOME部分     /////
====================================*/

/*=== 画像　welcom　画像　のデザイン ===*/
.home_welcome_block {
	width: 99%;
	max-width:1140px;
	margin: 0px auto;
	position: relative;
	text-align: center;
    margin-bottom: 10px;
}
.home_welcome_block span.leftItem {
	position: absolute;
	left: 0px;
	top: 115px;
	text-align: left;
}
.home_welcome_block span.rightItem {
	position: absolute;
	right: 0px;
	top: 115px;
	text-align: right;
}
.home_welcome_block span.leftItem img {
	height: auto;
	width: 260px;
	}
	.home_welcome_block span.rightItem img {
	height: autopx;
	width: 260px;
}
@media screen and (max-width:1040px) {
	.home_welcome_block {
    margin-bottom: 0px;
	}
	.home_welcome_block span.leftItem {
    position: relative;
    display: inline-block;
    width: 47%;
	padding: 20px 0px 0px 0px;
    top: 0px;
	}
	.home_welcome_block span.rightItem {
    position: relative;
    display: inline-block;
    width: 47%;
	padding: 20px 0px 0px 0px;
    top: 0px;
	}
}

/*=== トップページ上部　WELCOME部分　タイトル ===*/
.home_welcome {
    text-align: center;
	font-family: "Kaimin Sora Bold", "游ゴシック", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
}
.home_welcome h2 {
    font-size: 16px;
    font-weight: 400;
    margin: 0 0 30px;
}
.home_welcome h2 .hw_bt {
    font-size: 42px;
    font-weight: bold;
    letter-spacing: 5px;
}
.home_welcome .hw_text {
    text-align: center;
}



/*     トップページ　はじめての方へ　PC3/SP2列      /////
====================================*/

/*=== PC3列/SP2列 ===*/
.pickitem-top {
}
.pickitem-top ul {
    list-style: none;
    display: flex;
	justify-content: flex-start;
    padding: 0;
    margin: 0;
	flex-wrap: wrap;
}
.pickitem-top li {
    box-sizing: border-box;
    width: calc(100% / 3);
    border-bottom: none;
	padding: 0px 10px 20px;
}
.pickitem-top li a {
	padding: 25px 0px;
    background-color: #fff;
	color: #333333;
	text-decoration: none;
	display: flex;
    justify-content: center;
    align-items: center;
	border-radius: 5px;
	box-shadow: 3px 3px 3px rgba(0,0,0,.2);
	display: block;
	text-align: center;
}
.pickitem-top li a h3 {
    font-weight: bold;
	font-size: 20px;
    margin-top: 10px;
    color: #585858;
}
.pickitem-top li:hover {
	opacity: 0.8 ;
}
.pickitem-top i {
	font-size: 50px;
	color: #21b384;
}
@media (max-width: 768px) {
	.pickitem-top {
	}
	.pickitem-top li {
	text-align: center;
	width: calc(100% / 2);
	padding: 5px 5px;
	}
	.pickitem-top li a {
    padding: 10px 5px;
    font-size: 15px;
	}
	.pickitem-top li a h3 {
    font-size: 18px;
    margin-top: 5px;
	}
	.pickitem-top i {
	font-size: 35px;
	color: #21b384;
	}
}



/*     トップページ　お知らせ項目      /////
====================================*/

.top_news_box {
	background-color: #fff;
    padding: 20px 10px;
    border-radius: 5px;
    margin-top: 65px;
}
@media only screen and (max-width: 768px) {
    .top_news_box {
    padding: 10px 10px;
    margin-top: 20px;
    }
}

/*=== お知らせ　表示枠デザイン ===*/
.top_news-area {
    text-decoration: none;
}
.top_news-area a {
    text-decoration: none;
}
.top_news-area dt {
    margin: 0px 0px 0px 15px;
    float: left;
    clear: both;
    width: 105px;
}
.top_news-area dd {
    padding: 0 15px 5px;
	margin: 0px 0px 7px 0px;
    border-bottom: 1px dotted #5D6138;
    /* 末尾を・・・　ここから */
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /* 末尾を・・・　ここまで */
}
@media only screen and (max-width: 768px) {
	.top_news-area {
    }
    .top_news-area dt {
    margin: 5px 0 0 0;
    float: none;
    }
    .top_news-area dd {
    padding: 0px 0px 2px 0px;
    margin: 0px 0px 0px 0px;
    }
}

/*=== 記事一覧へのリンク ===*/
.all-news {
	float: right;
    font-size: 15px;
    margin-bottom: -25px;
    margin-top: -25px;
}
.all-news a {
	color: #E51A00;
	text-decoration: none;
}
.all-news i {
    color: #E51A00;
	margin-right: 10px;
}
@media only screen and (max-width: 768px) {
    .all-news {
    margin-top: -15px;
    }
}





/*====================================

     4. Footer     ////////////////////////
	
====================================*/



/*     フッター　背景デザイン     /////
====================================*/

.footer {
	background-image: url("https://minagof.com/wp-content/uploads/2019/05/haikei_stripe-blue1.png");
	background-color: #E1F0FF;
	background-repeat: no-repeat;
    padding: 0px;
}
@media screen and (max-width: 768px) {
	.footer {
    background-repeat: repeat-y;
    background-size: contain;
	}
}
/* 背景トップの白波デザイン */
.footer {
    position: relative
}
.footer:before {
    content: '';
	height: 4px;
    width: 100%;
    background: url(https://minagof.com/wp-content/uploads/2019/05/wave_top.png) repeat-x 0 0;
    background-size: 26px 4px;
    position: absolute;
    top: 0px;
}



/*     フッターメニュー　デザイン調整     /////
====================================*/

@media screen and (max-width: 768px) {
    .navi-footer-in > .menu-footer li.menu-item {
    border: 1px solid #fff;
    }
    .navi-footer-in > .menu-footer li.menu-item a {
    background-color: #fff;
    }
}



/*     フッター　NEWSエリアのデザイン      /////
====================================*/

.bottom_news_box {
	background-color: #fff;
    padding: 10px 10px;
    border-radius: 5px;
    margin-top: -11px;
}
@media only screen and (max-width: 768px) {
    .bottom_news_box {
    padding: 10px 10px;
    margin-top: 20px;
    }
}

/*=== お知らせ　表示枠デザイン ===*/
.bottom_news-area {
    text-decoration: none;
}
.bottom_news-area a {
    text-decoration: none;
}
.bottom_news-area dt {
    margin: -2px 0px -4px 15px;
    clear: both;
    width: 100px;
}
.bottom_news-area dd {
    padding: 0 15px 4px;
	margin: 0px 0px 6px 0px;
    border-bottom: 1px dotted #5D6138;
    /* 末尾を・・・　ここから */
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /* 末尾を・・・　ここまで */
}
@media only screen and (max-width: 768px) {
	.bottom_news-area {
    }
    .bottom_news-area dt {
    margin: 5px 0 0 0;
    }
    .bottom_news-area dd {
    padding: 0px 0px 2px 0px;
    margin: 0px 0px 0px 0px;
    }
}





/*====================================

     5. Page     //////////////////////////
	
====================================*/



/*     はじめての方へ     /////
====================================*/

/*=== ３つの理念　PC3列/SP1列 ===*/
.identity {
    margin-top: 50px;
}
.identity ul {
    list-style: none;
    display: flex;
	justify-content: flex-start;
    padding: 0;
    margin: 0;
	flex-wrap: wrap;
}
.identity li {
    box-sizing: border-box;
	width: calc(100% / 3);
    border-bottom: none;
    padding: 0px 10px;
    justify-content: center;
    align-items: center;
	border-radius: 5px;
	display: block;
	text-align: center;
}
.identity li img {
	box-shadow: 3px 3px 3px rgba(0,0,0,.2);
}
@media screen and (max-width:1000px) {
	.identity {
	}
	.identity li {
	text-align: center;
	width: calc(100% / 3);
	padding: 5px 5px;
	}
}
@media (max-width: 750px) {
	.identity {
    margin-top: 25px;
	}
	.identity li {
	text-align: center;
	width: calc(100% / 1);
	padding: 5px 5px;
	}
}

/*=== ３つの理念　ボックスデザイン ===*/
.identity-box {
    border-radius: 10px;
    margin: 1em 0 0;
    padding: 1.5em 1em 1em;
    position: relative;
    border: 5px solid #ffc107;
    background-color: #ffecb3;
}
.identity-box-title{
    position: absolute;
    top: -1em;
    left: 39%;
    font-weight: bold;
    font-size: 1.1em;
    background-color: #ffc107;
    color: #fff;
    padding: 0 0.5em;
    border-radius: 10px;
}
.identity-box p {
    margin: 0;
    padding: 0;
}

/*=== オーナーのコメント吹き出しデザイン ===*/
.comment-box_1{
    position: relative;
    padding: 20px;
    background-color: #CC66C2;
    color: #ffffff;
    border-radius: 10px;
}
/* 色付きの半円 */
.comment-box_1::before{
    content: '';
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-radius: 50%;
    transform: rotate(45deg);
    left: 20px;
    top: -15px;
    border-left: 20px solid #CC66C2;
    border-top: 20px solid #CC66C2;
    border-right: 20px solid transparent;
    border-bottom: 20px solid transparent;
}
/* 白い半円 */
.comment-box_1::after{
    content: '';
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-radius: 50%;
    transform: rotate(45deg);
    left: 35px;
    top: -20px;
    border-left: 20px solid #ffffff;
    border-top: 20px solid #ffffff;
    border-right: 20px solid transparent;
    border-bottom: 20px solid transparent;
}

/*=== 愛犬Konちゃん　コメント ===*/
.kon-comment {
	text-align: right;
	font-size: 85%;
	color: gray;
	margin-top: 5px;
}

/*=== お店のこだわり　PC4列/SP2列 ===*/
.preference {
}
.preference ul {
    list-style: none;
    display: flex;
	justify-content: flex-start;
    padding: 0;
    margin: 0;
	flex-wrap: wrap;
}
.preference li {
    box-sizing: border-box;
	width: calc(100% / 4);
    border-bottom: none;
	padding: 0px 10px 0;
	text-decoration: none;
    justify-content: center;
    align-items: center;
	display: block;
	text-align: center;
}
.preference-in {
    border: solid 1px;
    padding: 10px;
    border-radius: 5px;
    height: 470px;
    background-color: #fff;
    font-size: 16px;
}
.preference-in .text{
    text-align: left;
}
.preference li h3 {
    font-weight: bold;
	font-size: 18px;
	color: #585858;
    padding: 5px 0;
}
.preference li h3:before {
    content: "＼";
    margin-right: 5px; 
}
.preference li h3:after {
    content: "／";
    margin-left: 5px;
}
.preference li img {
	box-shadow: 3px 3px 3px rgba(0,0,0,.2);
    margin: 10px 0 5px;
    border-radius: 15px;
}
@media screen and (max-width:1000px) {
	.preference {
	}
	.preference-in {
    height: auto;
    }
	.preference li {
	text-align: center;
	width: calc(100% / 2);
	padding: 5px 5px;
    font-size: 15px;
	}
}
@media (max-width: 768px) {
	.preference {
	}
	.preference-in {
    height: auto;
    }
	.preference li {
	text-align: center;
	width: calc(100% / 1);
	padding: 10px 5px;
    font-size: 15px;
	}
	.preference li h3 {
	font-size: 19px;
	}
}




/*     メニュー     /////
====================================*/

/*=== メニュー　説明上部 ===*/
.menu-text {
	text-align: center;
}
@media (max-width: 768px) {
	.menu-text {
	text-align: left;
    }
}

/*=== メニュー表 ===*/
.menu-table {

}
.menu-table th, table td {
    border: 1px solid #95bfe7;
    padding: 10px;
}
.menu-table tr th {
    background-color: #a5d1f4;	
}
/* 各行に配色 */
.menu-table tr:nth-of-type(2n+0) {
    background-color: #e4f0fc !important;
}

/*=== 単品メニュー表 ===*/
.tanpin-menu-table {

}
.tanpin-menu-table th, table td {
    border: 1px solid #95bfe7;
    padding: 10px;
}
.tanpin-menu-table tr th {
    background-color: #a5d1f4;	
}
/* 各行に配色 */
.tanpin-menu-table tr:nth-of-type(2n+1) {
    background-color: #e4f0fc !important;
}

/*=== 飼い主様へ ===*/
.notes {
	
}
.notes h2{
    background-color: #f4ced5!important;
    padding: 15px 0px!important;
    text-align: center;
    letter-spacing: 5px;
    margin: 0px;
}
.notes ul {
	position: relative;
    padding: 20px 0 0 30px;
}
.notes ul li {
	margin: 15px 0!important;
    font-size: 0.9em;
	list-style: none;
}
.notes ul li:before {
    font-family: "FontAwesome";
    content: "\f1b0";
    position: absolute;
    left : 5px;
    color: #ff938b;
}
.notes .point {
    font-size: 0.8em;
    color:#e54659;
}
@media (max-width: 768px) {
    .notes h2{
    padding: 5px 0px!important;
    }
	.notes ul {
    padding: 5px 0 0 30px;
    }
    .notes ul li {
	margin: 10px 0!important;
    line-height: 1.5;
    }
	.notes .point {
    font-size: 1em;
    }
}



/*     トリミング     /////
====================================*/

/*=== トリミング　説明上部 ===*/
.trimming-text {
	text-align: center;
}
@media (max-width: 768px) {
	.trimming-text {
	text-align: left;
    }
}

/*=== トリミング　説明上部の電話番号 ===*/
.trimming-tel {
	text-align: center;
    margin: 30px 0 44px;
}
.trimming-tel .fa {
	font-size: 42px;
    color: #ff938b;
    margin: 0 15px 0 0;
}
.trimming-tel .tel-link a {
	font-size: 42px;
    color: #ff938b;
    text-decoration: none;
}
.trimming-tel .times {
    background-color: #F8E8E7;
	margin: 0 auto;
    width: 600px;
    padding: 10px 0;
    border-radius: 20px;
}
.trimming-tel .times-comm {
	font-size: 14px;
}
@media (max-width: 768px) {
    .trimming-tel {
	text-align: center;
    margin: 20px 0 32px;
    }
    .trimming-tel .fa {
	font-size: 30px;
    margin: 0 10px 0 0;
    }
    .trimming-tel .tel-link a {
	font-size: 30px;
    }
    .trimming-tel .times {
    width: 90%;
    padding: 5px 0;
    border-radius: 20px;
    }
	.trimming-tel .times-comm {
	font-size: 12px;
	}
}

/*=== トリミング流れ　h2  ===*/
.tf_h2 {
    background: url(https://minagof.com/wp-content/uploads/2019/05/trimming-flow.png) calc(50% - 31px) center no-repeat;
    padding: 10px 0 12px;
}
.tf_h2 h2 {
    font-size: 40px;
    color: #88473D;
    letter-spacing: 10px;
}
@media screen and (max-width:768px) {
	.tf_h2 {
	background: url(https://minagof.com/wp-content/uploads/2019/05/trimming-flow.png) calc(50% - 10px) center no-repeat;
    background-size: contain;
    height: auto;
    padding: 10px 0 13px;
    }
	.tf_h2 h2 {
    font-size: 28px;
    color: #88473D;
    letter-spacing: -2px;
    }
}

/*=== トリミング流れ　全体デザイン ===*/
#flow-box {
    padding: 50px 30px
}
#flow-box section {
	border-top: 1px solid #83D2C2;
	padding: 60px 0px 60px;
	position: relative;
}
#flow-box section:after {
	content: "";
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    width: 0;
    height: 0;
    border-style: solid;
    bottom: -30px;
    border-width: 30px 50px 0 50px;
    border-color: #83D2C2 transparent transparent transparent;
}
#flow-box section:first-child {
    border-top: none;
    padding-top: 0px
}
#flow-box section:last-child {
    padding-bottom: 0px;
}
#flow-box section:last-child:after {
	display: none;
}
#flow-box section h2 {
    margin: 5px 0 35px;
	padding: 0px 0px 10px 90px;
	font-size: 22px;
	font-weight: bold;
	color: #000;
	position: relative;
}
@media screen and (max-width:768px) {
	#flow-box {
    padding: 40px 8px 30px;
    }
	#flow-box section {
    padding: 50px 0px 30px;
    }
	#flow-box section h2 {
    margin: 0px 0 25px;
    }
	#flow-box section img {
	margin-bottom: 5px;
    }
}
	

/* 各ステップ */
#flow-box section h2.step1:before {
	content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: -8px;
    width: 65px;
    height: 65px;
    background: url(https://minagof.com/wp-content/uploads/2019/05/trimming-1.png) no-repeat 0 0;
	background-size: 65px;
}
#flow-box section h2.step2:before {
	content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: -8px;
    width: 65px;
    height: 65px;
	background: url(https://minagof.com/wp-content/uploads/2019/05/trimming-2.png) no-repeat 0 0;
	background-size: 65px;
}
#flow-box section h2.step3:before {
	content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: -8px;
    width: 65px;
    height: 65px;
	background: url(https://minagof.com/wp-content/uploads/2019/05/trimming-3.png) no-repeat 0 0;
	background-size: 65px;
}
#flow-box section h2.step4:before {
	content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: -8px;
    width: 65px;
    height: 65px;
	background: url(https://minagof.com/wp-content/uploads/2019/05/trimming-4.png) no-repeat 0 0;
	background-size: 65px;
}
#flow-box section h2.step5:before {
	content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: -8px;
    width: 65px;
    height: 65px;
    background: url(https://minagof.com/wp-content/uploads/2019/05/trimming-5.png) no-repeat 0 0;
	background-size: 65px;
}
#flow-box section h2.step6:before {
	content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: -8px;
    width: 65px;
    height: 65px;
    background: url(https://minagof.com/wp-content/uploads/2019/05/trimming-6.png) no-repeat 0 0;
	background-size: 65px;
}
#flow-box section h2.step7:before {
	content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: -8px;
    width: 65px;
    height: 65px;
    background: url(https://minagof.com/wp-content/uploads/2019/05/trimming-7.png) no-repeat 0 0;
	background-size: 65px;
}

/*=== トリミング流れ　各項目のテキスト・画像位置デザイン ===*/
.flow-item {
}
.image {
	min-height: 200px;
}
.flow-item img {
	width: 100%;
}
@media (min-width: 768px) {
    .flow-in {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    }
    .image {
    padding-right:0;
    padding-left: 5vw;
    width: 100%;
    flex: 1;
	}
    .text {
    flex: 1;	
	}
}

/*=== シャンプー前作業　PC4列/SP2列 ===*/
.shampoo-before {
}
.shampoo-before ul {
    list-style: none;
    display: flex;
	justify-content: flex-start;
    padding: 0;
    margin: 0;
	flex-wrap: wrap;
}
.shampoo-before li {
    box-sizing: border-box;
	text-align: center;
	width: calc(100% / 4);
    border-bottom: none;
	padding: 0px 10px 20px;
	text-decoration: none;
    justify-content: center;
    align-items: center;
	border-radius: 5px;
	display: block;
}
.shampoo-before li h3 {
    font-weight: bold;
	font-size: 18px;
    color: #585858;
}
.shampoo-before li img {
	box-shadow: 3px 3px 3px rgba(0,0,0,.2);
    margin: 10px 0 5px !important;
}
.shampoo-before .sbtext {
    font-size: 0.9em;
    text-align: left;
}
@media (max-width: 768px) {
	.shampoo-before {
	}
	.shampoo-before li {
	width: calc(100% / 2);
	padding: 5px 5px;
    font-size: 15px;
	}
	.shampoo-before li h3 {
	font-size: 16px;
	}
	.shampoo-before li img {
    margin: 5px 0 0 !important;
    }
}




/*     サロン案内     /////
====================================*/

/*=== サロン案内　説明上部 ===*/
.salon-text {
	text-align: center;
}
@media (max-width: 768px) {
	.salon-text {
	text-align: left;
    }
}


/*=== サロン詳細の表 ===*/
.salon-info {
	width: 100%;
    border-collapse: separate;
	border-spacing: 2px;
}
.salon-info th,
.salon-info td {
	border: 0px;
	padding: 4px 10px;
}
.salon-info th {
	font-weight: bold;
	background-color: #FFE4B5; 
	width: 215px;
    text-align: center;
}
@media screen and (max-width: 767px) {
	.salon-info th, .salon-info td {
	display: block;
	width: 100%;
	border: 0px;
	padding: 5px 20px;
	text-align: left;
	}
}

/*=== サロン画像の並びデザイン　PC4列/SP2列 ===*/
.salon-img {
    margin-bottom: -25px;
}
.salon-img ul {
    list-style: none;
    display: flex;
	justify-content: flex-start;
    padding: 0;
    margin: 0;
	flex-wrap: wrap;
}
.salon-img li {
    box-sizing: border-box;
	width: calc(100% / 3);
    border-bottom: none;
	padding: 0px 10px 20px;
}
.salon-img li a {
    background-color: #fff;
	color: #333333;
	text-decoration: none;
	display: flex;
    justify-content: center;
    align-items: center;
	border-radius: 5px;
	display: block;
	text-align: center;
}
.salon-img li a img {
	box-shadow: 3px 3px 3px rgba(0,0,0,.2);
}
.salon-img li:hover {
	opacity: 0.8 ;
}
@media (max-width: 767px) {
	.salon-img {
    margin-bottom: -7px;
    }
	.salon-img li {
	text-align: center;
	width: calc(100% / 2);
	padding: 5px 5px;
	}
	.salon-img li a {
	font-size: 15px;
	}
}

/*=== サロン案内　ドッグラン項目 ===*/
.dog-run {
	
}
.dog-run .dr_text {
    text-align: center;
    margin-bottom: 25px;
}
.dog-run img {
	box-shadow: 3px 3px 3px rgba(0,0,0,.2);
}
@media (max-width: 767px) {
    .dog-run .dr_text {
    text-align: left;
    margin-bottom: 10px;
    }
}




/*====================================

     6. Contact     ///////////////////////
	
====================================*/



/*     問い合わせ　上部テキスト     /////
====================================*/

/*=== 問い合わせ　説明上部のテキスト ===*/
.contact-text {
	text-align: center;
}
@media (max-width: 768px) {
	.contact-text {
	text-align: left;
    }
}

/*=== 問い合わせ　説明上部の電話番号 ===*/
.contact-tel {
	text-align: center;
    margin: 30px 0 44px;
}
.contact-tel-title {
    font-size: 25px;
    font-weight: bold;
    letter-spacing: 5px;
}
.contact-tel .fa {
	font-size: 42px;
    color: #ff938b;
    margin: 0 15px 0 0;
}
.contact-tel .tel-link a {
	font-size: 42px;
    color: #ff938b;
    text-decoration: none;
}
/* 営業時間 */
.contact-tel .times {
    background-color: #F8E8E7;
	margin: 0 auto;
    width: 600px;
    padding: 10px 0;
    border-radius: 20px;
}
.contact-tel .times-comm {
	font-size: 14px;
}
@media (max-width: 768px) {
    .contact-tel {
	text-align: center;
    margin: 20px 0 5px;
    }
    .contact-tel-title {
    font-size: 20px;
    letter-spacing: 2px;
    }
    .contact-tel .fa {
	font-size: 30px;
    margin: 0 10px 0 0;
    }
    .contact-tel .tel-link a {
	font-size: 30px;
    }
	/* 営業時間 */
    .contact-tel .times {
    width: 90%;
    padding: 5px 0;
    border-radius: 20px;
    }
	.contact-tel .times-comm {
	font-size: 12px;
	}
}



/*     問い合わせフォームのデザイン調整     /////
====================================*/

/*=== 問合せフォーム　上部テキスト ===*/
.contact-form-text {
	text-align: center;
    margin: 70px 0 35px;
}
@media screen and (max-width:768px) {
    .contact-form-text {
    margin: 30px 0 25px;
    }
}

/*=== 問合せフォーム　タイトル ===*/
.contact-form-title {
    font-size: 25px;
    letter-spacing: 5px;
    font-weight: bold;
    margin: 0 0 35px;
}
@media(max-width: 768px) {
    .contact-form-title {
    font-size: 20px;
    letter-spacing: 2px;
    margin: 0 0 15px;
    }	
}

/*=== フォーム全体のデザイン調整 ===*/
.inquiry {
    margin-bottom: 35px;
}
/* 見出し欄(項目) */
.inquiry th {
    text-align: left;
    color: #444;
    padding: 15px;
    width: 30%;
    background: #f7f7f7;
    border: solid 1px #d7d7d7;
}
/* 通常欄(回答) */
.inquiry td {
    border: solid 1px #d7d7d7;
	padding: 10px;
}
/*横の行とテーブル全体*/
.entry-content .inquiry tr,.entry-content .inquiry table {
 border: solid 1px #d7d7d7;	
}

/*=== プレースホルダーのカラー調整 ===*/
::-webkit-input-placeholder {
  color: #ccc;
}
::-moz-placeholder {
  color: #ccc; opacity: 1;
}
:-ms-input-placeholder {
  color: #ccc;
}

/*=== 必須・任意の調整 ===*/
/*必須の調整*/
.haveto {
    font-size: 7px;
    padding: 5px;
    background: #ff9393;
    color: #fff;
    border-radius: 2px;
    margin-right: 5px;
    position: relative;
    bottom: 1px;
}
/*任意の調整*/
.any {
    font-size: 7px;
    padding: 5px;
    background: #93c9ff;
    color: #fff;
    border-radius: 2px;
    margin-right: 5px;
    position: relative;
    bottom: 1px;
}

/*=== ラジオボタンを縦並びに ===*/
.verticallist .wpcf7-list-item {
    display: block;
}

/*=== 送信ボタンのデザイン調整 ===*/
#formbtn {
    display: block;
    padding: 15px;
    width: 350px;
    background: #ffaa56;
    color: #fff;
    font-weight: bold;	 
    border-radius: 2px;
    margin: 25px auto 0;
	border: 2px solid #ffaa56;
}
/* 送信ボタンマウスホバー時 */
#formbtn:hover {
    background: #fff;
    color: #ffaa56;
    border: 2px solid #ffaa56;
}
@media(max-width: 768px) {
	.inquiry {
    margin-bottom: 25px;
    }
    .inquiry th,.inquiry td {
    display: block !important;
    width: 100% !important;
    border-top: none !important;
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
    }
    .inquiry tr:first-child th {
    border-top: 1px solid #d7d7d7 !important;
    }
	/* 必須・任意のサイズ調整 */	
    .inquiry .haveto,.inquiry .any {	
    font-size: 10px;
    }
	/* 通常欄(回答) */
	.search-edit, input[type="text"],
    input[type="password"],
    input[type="date"],
    input[type="datetime"],
    input[type="email"],
    input[type="number"],
    input[type="search"],
    input[type="tel"],
    input[type="time"],
    input[type="url"],
    textarea,
    select {
    padding: 12px;
    border: 1px solid #ccc;
    font-size: 16px;
    }
	/*=== 送信ボタンのデザイン調整 ===*/
    #formbtn {
    width: 70%;
    }
}






/*====================================

     7. Blog     //////////////////////////
	
====================================*/





/*====================================

     8. Other     /////////////////////////
	
====================================*/



/*     PCとSP(デバイス幅768px以下)の表示分け     /////
====================================*/

.pc-only { display: block !important; }
.sp-only { display: none !important; }
@media only screen and (max-width: 768px) {
.pc-only { display: none !important; }
.sp-only { display: block !important; }
}



/*     snsエリア　タイトル     /////
====================================*/

/* Instagram */
.sns-tit_ins {
}
.sns-tit_ins h2 {
    font-size: 25px;
}
.sns-tit_ins h2:before {
	content: "";
	display: inline-block;
	width: 30px;
	height: 30px;
	background: url(https://minagof.com/wp-content/uploads/2019/05/icon_instagram.png) no-repeat;
	background-size: contain;
    margin-right: 15px;
    margin-bottom: -5px;
}

/* Facebook */
.sns-tit_fb {
}
.sns-tit_fb h2 {
    font-size: 25px;
}
.sns-tit_fb h2:before {
	content: "";
	display: inline-block;
	width: 30px;
	height: 30px;
	background: url(https://minagof.com/wp-content/uploads/2019/05/icon_facebook.png) no-repeat;
	background-size: contain;
	margin-right: 15px;
	margin-bottom: -5px;
}



/*     サイドバー　タイトルデザイン     /////
====================================*/

.sidebar h3 {
    background-color: #D7EDFC;
    padding: 5px 10px;
    text-align: center;
}
@media(max-width: 768px) {
    .sidebar h3 {
    padding: 5px 10px;
    }
}





/*====================================

     9. Cocoonの基礎デザイン調整     ////////

====================================*/



/*     ヘッダーメニューのデザイン調整　PC表示     /////
====================================*/

nav#navi, .menu-header .sub-menu{
    font-weight: bold;
    box-shadow: 0 5px 15px -5px rgba(0,0,0,0.2);
}

.menu-header .sub-menu .item-label{
    font-size: 80%;
}
.menu-header .item-label{
    color: #b5b5b5 !important;
}
.menu-header .current-menu-item,
.menu-header .current-post-item,
.menu-header .current-menu-ancestor,
.menu-header .current-post-ancestor,
.menu-header .menu-item:hover {
    color: #333 !important;
    border-bottom: 3px solid #FDD835;
    transition: all .2s ease;
}

.menu-header .sub-menu .menu-item,
.menu-header .sub-menu .menu-item:hover{
    border-bottom: none;
}
.menu-header .current-menu-item>a .item-label,
.menu-header .current-post-item>a .item-label,
.menu-header .current-menu-ancestor>a .item-label,
.menu-header .current-post-ancestor>a .item-label,
.menu-header .item-label:hover{
    color: #333 !important;
    transition: all .2s ease;
}



/*     スライドインメニュー　SP表示     /////
====================================*/

.menu-content {
    text-align: center;
}
.menu-drawer a {
    color: #00AFE0;
    padding: 10px 0;
    font-size: 20px;
    font-weight: bold;
}



/*     ボトムメニュー　SP表示     /////
====================================*/

.mobile-menu-buttons {
    background: #D7EDFC;
}



/*     基本タイトルの修正     /////
====================================*/

/*=== h2 ===*/
.article h2 {
    padding: 0px;
    background-color: transparent;
}

/*=== h3 ===*/
.article h3 {
    border-left: none;
    border-right: none;
    border-top: none;
    border-bottom: none;
    margin: 0px;
    font-size: 22px;
    padding: 0px;
}



/*     文章上部と下部のp項目のマージン調整     /////
====================================*/

p:first-of-type {
	margin-top: 0px;
}
p:last-of-type {
	margin-bottom: 0px;
}



/*     投稿日・更新日の非表示     /////
====================================*/

.page .date-tags {
    display: none;
}



/*     table関連     /////
====================================*/

table {
    margin-bottom: 0px;
}

.container table tr {
  background-color: transparent;
}



/*     記事のリストのマージン調整     /////
====================================*/

.article ul li, .article ol li {
    margin: 0em;
}



/*     パンくずリストのデザイン調整     /////
====================================*/

#breadcrumb .fa-file-o {display: none;}　 /*パンくず固定ページアイコン消す*/
#breadcrumb .fa-folder {display: none;}　 /*パンくず投稿ページアイコン消す*/
.breadcrumb a{color:#333333;}　 /*パンくず色*/
.breadcrumb {font-size:1.08em;}　/*パンくずサイズ*/
/* パンくずリストのマージン調整 */
.breadcrumb.sbp-main-before,
.breadcrumb.sbp-footer-before,
.breadcrumb.pbp-main-before,
.breadcrumb.pbp-footer-before {
    background-color: transparent;
    margin: 5px auto 0;
    padding: 5px;
}



/*     固定ページのシェアボタンとフォローボタンの非表示     /////
====================================*/

.page .sns-share,
.page .sns-follow {
    display: none;
}



/*     フッターウィジェットをスマホ閲覧時でも表示     /////
====================================*/

@media screen and (max-width: 768px) {
	.footer-widgets {
		display: block;
	}
}





/*====================================

     10. 期間限定・イベント     ////////

====================================*/



/*     営業日変更に関するお知らせ     /////
====================================*/
.i-news {
	text-align: center;
}

.i-news h2 {
	font-size: 30px;
	margin: 15px 0 25px;
	letter-spacing: 3px;
}
.heading {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 26px;
	text-align: center;
}
.heading::before,
.heading::after {
	content: '';
	width: 3px;
	height: 40px;
	background-color: black;
}
.heading::before {
	margin-right: 30px;
	transform: rotate(-35deg)
}
.heading::after {
	margin-left: 30px;
	transform: rotate(35deg)
}

.i-news .com {
	font-size: 22px;
    font-weight: bold;
}
.i-news .b-link {
	margin-top: 20px;
	font-size: 25px;
}
.i-news .emp {
	color: #DE2126;
}
@media screen and (max-width: 768px) {
	.i-news {
    text-align: center;
    margin: 0 0 8px;
	}
	.i-news .com {
	font-size: 16px;
	}
	.i-news h2 {
    font-size: 25px;
    margin: 15px 0 15px;
    letter-spacing: 1px;
	}
	.i-news .b-link {
    margin-top: 15px;
    font-size: 20px;
	}
}






/*====================================

     テストCSS     ////////

====================================*/