@charset "UTF-8";

/*
Theme Name:lotus_tcd039-child
Template:lotus_tcd039
*/

/*header調整*/

.pc .home #header_logo{
	width:100%;
	display: flex;
	justify-content: space-between;
}

.pc #header_logo #logo_text, .pc #header_logo #logo_image{
	width: auto;
	position: inherit;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
	top:unset;
}

.pc .home #header_top,.pc .home #header_logo{height:auto;}

.pc .home #header_top{min-width:unset;}


.h-info{padding-top:1rem;}

.h-tel{margin: 0.5rem;}

.h-tel a{
	font-size: 1.2rem;
    text-decoration: none;
    color: var(--pink);
    font-weight: bold;
	display: flex;
	align-items: flex-start;
}

.h-tel a img{
	vertical-align: bottom;
    width: 32px;
	height:32px;
    padding-right: 2px;
}

.h-tel p{font-size:12px; margin:0;}

.h-info .mail a,.h-info .line a{width:160px; margin-bottom: 1em;}
.h-info .mail,.h-info .line{margin-right: 10px;}

#header.flex-sp{justify-content: space-between;}

.h_logo{width:240px;}

#logo_image{float: unset!important; margin:0!important;}

/*header-sp用調整*/
#logo_image_mobile{
	display: flex;
	/*float: unset!important;*/
	padding:4px 0;
	justify-content: space-between;
	align-items: center;
}

.mobile #header{height:auto; position:fixed;}

#logo_image_mobile img.m_logo{width:100%; max-width:160px;}

.m-menu{position: relative;}
a.menu_button{
	position: unset!important;
	width: 46px!important;
	height: 46px!important;
	line-height: 46px!important;
}
a.menu_button:before{
	top: 12px!important;
	left: 16px!important;
}

.mobile .h-info{padding-top:0; align-items: center;}
.mobile .h-info img{width:24px; height:24px;}
.mobile .h-info .h-tel,.mobile .h-info .mail,.mobile .h-info .line{margin:4px;}
.mobile .h-info .mail a,.mobile .h-info .line a{margin-bottom:0; box-shadow:none; padding:6px;}
.mobile .h-info .mail a img,.mobile .h-info .line a img{padding:0;}
.mobile .h-info .h-tel span,.mobile .h-info .mail span,.mobile .h-info .line span{
	text-align: center;
	font-size: 12px;
	/*display: block;*/
	font-weight: bold;
	color: #333;
	margin-top: 2px;
}
.mobile .h-info .h-tel span{color:var(--pink);}
.mobile .h-info .mail span,.mobile .h-info .line span{color:#fff;}

.mobile .h-info .h-tel a:active,.mobile .h-info .h-tel a:hover{color:#fff; background-color: #666; border:solid 2px #333;}

.mobile #header_slider{margin-top: 55px;}

@media (max-width: 850px){
	#header_logo{display: flex; justify-content: space-between;}
	#logo_image{max-width: 260px;}
	.h-info .mail a,.h-info .line a{width:34px; height:34px; min-width: 34px; margin-bottom:0; box-shadow:none; flex-direction: column;}
	.h-info .mail,.h-info .line{margin:4px;}
	.h-info .mail span,.h-info .line span{display: block; color:#fff;}
	.h-info .mail a img,.h-info .line a img{height:24px; height:24px; padding:4px 0;}
	.h_logo{width:180px;}
}

@media (max-width: 600px){
	.mobile .h-info .h-tel a{border:solid 2px var(--pink); border-radius: 10px; padding: 4px;}
	.mobile .h-info .h-tel a,.mobile .h-info .mail a,.mobile .h-info .line a{width:34px; height:34px; min-width: 34px;}
	.mobile .h-info a{display: flex!important; flex-direction:column; align-items: center;}
	.h_logo{width:140px;}
}

/*下層header_sp調整*/
.mobile #header_image{margin-top:116px!important;}
.mobile #bread_crumb{max-width:100%;}

.pc .home.header_fix #header_top { display:block; }
.pc .home.header_fix #header_bottom { width:100%; margin:0 auto; height:60px; position:relative; }
.pc .home.header_fix { padding-top:210px; }
.pc .home #logo_text_fixed, .pc .home #logo_image_fixed { display:none; }
.pc .home.header_fix #logo_text_fixed, .pc .home.header_fix #logo_image_fixed { display:block; height:60px; line-height:60px; position:absolute; left:50px; z-index:100; }
.pc .home.header_fix #logo_image_fixed img { position:absolute; top:0; bottom:0; margin:auto; max-width: inherit; }

.pconly-850{display:none;}
.sponly-850{display:block;}

@media only screen and (min-width: 850px){
	.pconly-850{display:block;}
	.sponly-850{display:none;}
}

/*footer調整*/
#footer_top{min-width: unset; margin-top: 0;}
#footer_top_inner{width:100%; padding: 4em 0;}
#footer_bottom{min-width: unset; height: 50px}
#footer_bottom_inner{width: 100%; height: 50px;}
#footer_logo{margin: 0;}
#footer_logo img{max-width:300px;}

.footer_menu {display: unset; margin: 0.2em 0; width: unset; vertical-align: unset;}

#footer_menu{
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.footer_menu li:first-child a, .footer_menu li:only-child a{font-size:16px;}

#footer_top_inner p{font-size: 14px; margin: 1em 1em 0 1em;}
#footer_top_inner p a{color:var(--blue);}

/*下層調整*/
.not_home #main_col{
	width: 100%;
    margin: 0;
    padding: 0;
}

.pc .not_home #header{background-color:unset; position: unset; height: auto;}
.pc .not_home #header_top{display:block; background-color: #fff; border-bottom: 1px solid #ddd;
    box-shadow: 0 1px 3px 0 rgba(0,0,0,0.1);}
.pc .not_home #header_logo{display: flex; justify-content: space-between;}
.pc .not_home.header_fix2 #header{background-color: unset; border-bottom: unset; box-shadow: unset;}

#header_image{min-width: unset; max-height: 300px;}
#header_image .image img{max-height: 300px; object-fit: cover;}

#bread_crumb{min-width: unset; max-width: 80%; margin: 0 auto;}

.pc .home.header_fix #global_menu,.pc .home.header_fix #global_menu,.not_home #global_menu{background: rgba(255,255,255,0.7)!important;}

.pc .not_home #header_bottom{width: 100%;}

.not_home #main_contents{margin-top: -60px;}

.post_content h1, .post_content h2, .post_content h3, .post_content h4, .post_content h5, .post_content h6{
	line-height: 1.6;
	margin: unset;
	padding: unset;
}

.post_content p,.post_content li, .post_content dt, .post_content dd{line-height: 1.6;}

.post_content ul{list-style: none; margin-left: 0; margin-bottom:0;}


/*base*/

:root{
	--blue:#0095B6;
	--pink:#E6547C;
	--grn:#34AC90;
	--lylw:#FFF184;
	--lpink:#FDEDF0;
}

h2,h3,h4,h5,h2 span,h3 span,h4 span,h5 span{font-weight:bold;}

.pconly{display:none;}
.sponly{display:block;}

@media only screen and (min-width: 600px){
	.pconly{display:block;}
	.sponly{display:none;}
}

span.br{display:inline-block;}

.br-sp {display: block;}
.br-pc {display: none;}

@media screen and (min-width: 600px){
.br-sp {display: none;}
.br-pc {display: block;}
}

.center{text-align:center;}
.left{text-align:left;}
.right{text-align:right;}

@media (max-width: 700px){
.center-sp{text-align:center;}
}

.flex,.flex-sp{
	display:flex;
	justify-content: center;
	align-content: center;
}
@media (max-width: 700px){
	.flex:not(.reverse){flex-direction: column;}
	.flex.reverse{flex-direction: column-reverse;}
	}

.note{
	color: #333;
	margin:0; 
	padding:1rem 0;
	text-align: left;
	font-size:1rem;
	list-style-type: none;
}
.note li{
	position: relative;
	text-indent: -1em;
	padding-left: 1em;
}
.note>li:before{
	content:"※";
	left:0;
}

/*Contactform用調整*/
.wpcf7 p,.wpcf7,.wpcf7 select, .wpcf7 .wpcf7-list-item-label{font-size:16px;}


/*テーマ調整※テーマによって変更*/
p{font-size:16px; line-height:1.6; color:#333333; margin:1em 0;}

body{
	font-family:sans-serif!important;
	font-size:16px!important;
	/*min-width:unset;*/
}

#header_slider{min-width:unset;}



h2{font-size:24px; line-height: 1.6;}
@media (max-width: 700px){h2{font-size:20px;}}

h3{font-size: 1.17em; margin: 1em 0; line-height: 1.5;}

/*PC電話リンク*/
@media (min-width: 751px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}

/*レイアウト*/
section .inner{
	max-width:980px;
	padding:40px 20px;
	margin:0 auto;
}

/*共通*/
#problem ul,#point ul,#price ul:not(.price-in-list):not(.note):not(.note-in),#service ul,.flow ul,.list-item ul,#area ul,#service-u ul,.special-menu ul:not(.note):not(.circle1){list-style-type: none; padding:0; margin:0;}




/*見出しーballoon*/

section.balloon{
	position:relative;
	padding:1em;
	text-align: center;
}

.bg-blue{background-color:var(--blue);}
.bg-pink{background-color:var(--pink);}
.bg-grn{background-color:var(--grn);}

.bg-blue,.bg-pink,.bg-grn{color:#fff;}

.balloon h2,.balloon h2 span{padding:0;margin:0;}
.balloon h2 span:not(.br):not(.tt-small){font-size:1rem; display:block;}

.balloon:before{
	content: "";
	 position: absolute;
	top: 99%;
	left: 50%;
	margin-left: -15px;
	border: 15px solid transparent;
}

.balloon.bg-blue:before{border-top: 15px solid var(--blue);}
.balloon.bg-pink:before{border-top: 15px solid var(--pink);}
.balloon.bg-grn:before{border-top: 15px solid var(--grn);}

/*見出しーballoon下線*/
#problem h2,#point h2{
	display: inline-block;
	margin:0 auto 3rem;
    border-bottom: solid 3px #333;
    position: relative;
	padding-bottom:0.5rem;
}

#problem h2{color:var(--blue);}
#point h2{color:var(--pink);}

#problem h2:before,#point h2:before,
#problem h2:after,#point h2:after {
content: "";
position: absolute;
top: 100%;
transform: translateX(-50%);
}

#problem h2:before,#problem h2:after{left: 20%;}
#point h2:before,#point h2:after{left: 80%;}

#problem h2:before,#point h2:before {
border: 18px solid transparent;
border-top: 18px solid #333;
}

#problem h2:after,#point h2:after {
border: solid 19px transparent;
margin-top: -5px;
}
#problem h2:after{border-top: solid 19px #fff;}
#point h2:after {border-top: solid 19px #FDEDF0;}

@media (max-width: 600px){#problem .txt p{text-align:center;}}


/*リンクボタン*/

.mail a,.line a,a.pnk-btn,a.blue-btn{transition: transform .2s;}
.mail a:active,.line a:active,a.pnk-btn:active,a.blue-btn:active{transform: scale(.95);}
.mail a:hover,.line a:hover,a.pnk-btn:hover,a.blue-btn:hover{background-color: #666; color:#fff;}
.post_content .mail a:hover,.post_content .line a:hover,.post_content a.pnk-btn:hover,.post_content a.blue-btn:hover{color:#fff;}

.h-tel a:hover,.tel a:hover,.post_content .tel a:hover{color:#666;}


.mail a,.line a,a.pnk-btn,a.blue-btn{
	text-decoration: none;
    padding: 10px;
    border-radius: 10px;
    box-shadow: rgba(100,100,100,0.2) 6px 6px 0px;
    margin-bottom: 1.2em;
	font-weight: bold;
	min-width:180px;
}

a.pnk-btn,a.blue-btn{
	position: relative;
	display: inline-block;
    text-align: center;
	color:#fff;
}

a.pnk-btn::after,a.blue-btn::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 20px;
  width: 12px;
  height: 12px;
  margin: auto;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  box-sizing: border-box;
}

a.pnk-btn::after{transform: rotate(45deg);}
a.blue-btn::after{transform: rotate(135deg);}


.mail a,.line a{
	width: 280px;
	height:50px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.mail p,.line p{margin:0; color:#fff; font-size: 1.2rem;}

.mail a,a.pnk-btn{background-color: var(--pink);}

.line a{background-color: #06C755;}

a.pnk-btn{padding: 1em 2em 1em 1em;}

a.blue-btn{
	padding: 0.5em 2em 0.5em 0.5em;
	background-color:var(--blue);
	box-sizing: border-box;
	width: 100%;
	text-align: left;
	font-size: 18px;
}

.mail a img,.line a img{
	width: 30px;
	height:30px;
    padding-right: 6px;
}

.mail span,.line span{
	font-size: 0.7rem;
    display: block;
}

.tel a{
	font-size: 2.4rem;
    text-decoration: none;
    color: var(--pink);
    font-weight: bold;
}
@media (max-width: 600px){.tel a{font-size: 2rem;}}

.tel p{margin:0;padding:0;}

.tel img{width:40px; height:40px; vertical-align: baseline; padding-right:0.5rem;}

@media (max-width: 700px){.tel img{width: 32px; height:32px;}}

a.blue-btn img{width:40px; height:40px; vertical-align: middle; padding-right:0.2rem;}


/*info*/
.info{background-color: #F7E13C;}
.info .flex>div{padding: 0 0.5rem;}
.info>.inner>.flex{align-items: center;}
.info>.inner>p{
	font-weight: bold;
	font-size: 20px;
	margin-bottom: 0;
}
/*problem*/

#problem>.inner>.flex>.img{width:30%;}

#problem>.inner>.flex>.txt{width:50%;}

@media (max-width: 700px){
	#problem>.inner>.flex>.img{width:100%;}
	#problem>.inner>.flex>.txt{width:100%; min-width:280px;}
}

#problem ul li{
	line-height: 1.6;
	font-size: 18px;
	padding: 10px 20px;
	padding:14px 20px;
	background-color:#FFF184;
	color:#333;
	font-weight:bold;
	border-radius: 10px;
	margin-bottom:1em;
}

#problem img{width:280px; height: 300px;}

/*point lp-point*/
#point{background-color:var(--lpink);}

#point h2 span:not(.br){
	display: block;
	font-size:1rem;
	color:#333;
}

#point .flex,#lp-point .flex{
	flex-wrap: wrap;
	align-content: center;
}

#point ul li .flex-sp,#lp-point ul li .flex-sp{
	position: absolute;
    top: -24px;
    left: -10px;
    align-items: flex-start;
}

#lp-point ul li .flex-sp{top:-50px;}

#point li,#lp-point li{
	position: relative;
    background-color: #fff;
    border-radius: 16px;
    max-width: 320px;
    margin: 1rem 1rem 3rem 1rem;
    padding: 5.6rem 2rem 2rem 2rem;
}

#point li .img,#lp-point li .img{
	background-color: #FFF184;
    position: relative;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    padding: 10px;
    display: inline-block;
}

#lp-point li .img{border:solid 4px #000;}

#point li img,#lp-point li img{/*width:100%;*/ width:70px; height:70px;}
#point li p,#lp-point li p{margin:0;}

#point li .txt,#lp-point li .txt{padding-left: 1rem;}

#point li .txt p,#lp-point li .txt p{
	margin: 0;
	font-weight: bold;
    font-size: 1.6rem;
    color: var(--pink);
}

#lp-point li .txt p{color: #000; margin-bottom: 1rem;}

#point li .txt p span,#lp-point li .txt p span{font-size: 1rem;}

#point li .txt h3,#lp-point li h3{
	margin: 0;
    color: var(--blue);
    font-size: 1.3rem;
}

#lp-point li h3{
	text-align: center;
    margin-bottom: 0.5rem;
}

@media (max-width: 700px){
	#lp-point li h3{margin-top: 1rem;}
}

#lp-point h2{margin-bottom: 3rem;}


/*price*/
#price{background-color: var(--lylw);}
#price .flex:not(.single-list){flex-wrap: wrap;	justify-content: space-between;}
#price p{margin:0;}
.pink-tt-sub{font-weight: bold; font-size: 1.4rem;}
.pink-tt{color:var(--pink); font-weight:bold; font-size:4rem; line-height: 1; padding-bottom: 1.4rem;}
.pink-tt span{font-size:2.4rem;}
.tt-small{font-size:1rem;}

#price .price-plan>li,#price .single-wrap>li,#faq dl{
	background-color: #FFF;
    margin: 1.6rem 1rem;
    border-radius: 14px;
    box-shadow: rgba(100,100,100,0.3) 3px 3px 10px;
}

#price .price-plan>li{
	width: calc((100% - 6rem) / 3);
}

@media (max-width: 982px){
	#price .price-plan>li{width: calc((100% - 4rem) / 2);}
}

@media (max-width: 700px){
	#price .price-plan>li,#price .single-wrap>li,#faq dl{margin: 0.5rem 0;}
	#price .price-plan>li{width:100%;}
}

.price-plan img{
	margin-bottom:1em;
	box-sizing: border-box;
	width:200px;
	height:140px;
}


.plan-tt{
	background-color: var(--pink);
	border-radius: 14px 14px 0 0;
	padding: 0.8rem;
	font-weight: bold;
	color: #FFF;
	font-size: 1.4rem;
	line-height: 1;
}

.plan-tt span{font-size:1rem;}

#price li h3{color:var(--blue); font-size:1rem; padding:0 1em; margin: 1em 0;}
#price li h4{color:#666; margin-bottom:0; line-height: 1;}
#price li h4 span{font-size:1.2rem;text-decoration:line-through; }
#price li h5{color:var(--pink); font-size:1.6rem; margin:0 1em 1em 1em; line-height: 1;}
#price li h5 span{font-size:1rem;}
#price li>p{font-size:1.4rem; color:#F7E13C; line-height: 2;}

.single-list{
	padding:0 1em 1em 1em;
	justify-content: space-around;
	margin-bottom: 3em;
}

.single-list li,.single li{
	position: relative;
    display: flex;
    justify-content: space-between;
	line-height: 2rem;
}

.single-list li::before, .single li:not(.circle)::before{
    content: "";
    display: inline-block;
    width: 100%;
    height: 1px;
    background-image: linear-gradient(to right, #999, #999 4px, transparent 4px, transparent 8px);
    background-size: 8px 2px;
    background-position: left bottom;
    background-repeat: repeat-x;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

.single-tt{
	color:#666;
	margin-right: 2em;
	padding-right: 0.5em;
    background: #fff;
    position: relative;
}

.single-price{
	color:var(--pink);
	display: inline-block;
    background: #fff;
    position: relative;
    padding-left:0.5em;
}

.single-tt,.single-price{font-weight:bold;}

.single-list p{text-align:left;}

#price>.inner>h3{color:var(--blue); font-size:1rem; padding:0 1em;}
#price>.inner>h4{color:#333; font-size:1.2rem; line-height: 1.6;max-width: 600px; margin: 0 auto;padding-bottom: 2.4em;}
#price>.inner>h4>.pink-tt{color:var(--pink); font-size:1.6rem; padding-bottom: 0;}



/*service・area*/
#service .inner{max-width:900px;}
#service .flex{align-items: center;}
#service ul{display: flex; flex-wrap:wrap; justify-content: center;}
#service li,#area li{
	line-height: 1.6;
	border:solid 1px var(--blue);
	border-radius:50px;
	color:var(--blue);
	font-size: 1.2rem;
	padding:0.5em 1em;
	display: inline-block;
	margin:0.5em;
	text-align: center;
}
#area ul{display: flex;flex-wrap: wrap; justify-content: center;}
#area li{width:160px;}
@media (max-width: 700px){#area li{width:100px;}}

#area p{font-weight:bold; color:var(--blue); text-align: center;}

#service img{
	width: 200px;
	height: 188px;
    padding-right: 20px;
}

#service p{padding-bottom:1em;}

@media (max-width: 700px){
	#service li,#area li{font-size: 1rem;}
}

/*flow*/
.flow{background-color: var(--lylw);}

.flow li{
	position: relative;
	text-align: center;
	background-color: #FFF;
    margin: 1rem;
    border-radius: 14px;
    box-shadow: rgba(100,100,100,0.3) 3px 3px 10px;
	width: calc(100% / 4);
}

.flow li:not(:last-child):after{
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 10px 0 10px 12px;
	border-color: transparent transparent transparent var(--grn);
	position: absolute;
	top: 50%;
	right:-20px; 
}

@media (max-width: 700px){
	.flow li{width:100%; margin: 1rem 0;}
	.flow li:not(:last-child):after{
		border-width: 12px 14px 0 14px;
		border-color: var(--grn)  transparent transparent transparent;
		top: 103%;
		right:50%;
	}
}

.grn-tt{
	background-color: var(--grn);
	border-radius: 14px 14px 0 0;
	padding: 0.5rem;
	font-weight: bold;
	color: #FFF;
	font-size: 1rem;
	line-height: 1.6;
}

.flow .grn-tt+img{width:100px; height:100px;}
.grn-tt span{font-size:1.6rem; padding-left:6px;}
.flow p{margin:1em; text-align: left;}
.flow h3{color:var(--grn); margin-top:0;}

.credit{
	background-color: #fff;
	border-radius: 14px;
	font-weight:bold;
	align-items: center;
	justify-content: space-around;
	padding:1em;
	margin: 2em 1em;
}
@media (max-width: 700px){
	.credit{margin: 1em 0em;}
}

.credit img{width:100%; max-width:400px;}


/*case*/

.case-img.flex{align-items: center; margin-bottom: 3rem;}

.case-tt{
	display: inline-block;
	width:50px;
	height:50px;
	border-radius: 50%;
	background-color: var(--blue);
	padding:1em;
	color:#fff;font-weight:bold;
	line-height: 50px;
	margin-right: 1em;
}

.case-tt span{font-size:26px;}

.case-img .before,.case-img .after{padding: 1em; position:relative;}

.case-img .before:before{
	content: "before";
    position: absolute;
    top: 1em;
    left: 1em;
    background-color: rgba(0,0,0,0.6);
    color: #FFF;
    font-weight: bold;
    padding: 10px;
    border-radius: 14px 0 14px 0;
}

.case-img .before:after{
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 12px 0 12px 14px;
	border-color: transparent transparent transparent var(--blue);
	position: absolute;
	top: calc(50% - 1em);
    right: -6px;
}


.case-img .after:before{
	content: "after";
    position: absolute;
    top: 1em;
    left: 1em;
    background-color: var(--pink);
    color: #FFF;
    font-weight: bold;
    padding: 10px;
    border-radius: 14px 0 14px 0;
}

.case-img .after:after{
	content: '';
	display: inline-block;
	position: absolute;
	top:24px;
	left:70px;
	width: 30px;
	height: 30px;
	background-image: url("https://mokumokuchan.com/wp-content/uploads/2024/01/icon_fuyo_kira.png");
	background-size: contain;
	vertical-align: middle;
}

@media (max-width: 700px){
	.case-img .before:after{
		border-width: 12px 14px 0 14px;
		border-color: var(--blue)  transparent transparent transparent;
		top:96%;
		right: calc(50% - 1em);
	}
}

.case-img img{
	width: 300px;
	height: 300px;
	object-fit: cover;
	border-radius: 14px;
}
.case-txt h3{color:var(--pink); margin: 0;}

#case>.inner>h3{text-align: center; color:var(--blue);}

.list-item,.price-in{
	position: relative;
	text-align: center;
	background-color: #FFF;
    border-radius: 14px;
    box-shadow: rgba(100,100,100,0.3) 3px 3px 10px;
}

.list-item-inner{padding:1em;}

.list-item .flex-sp,.price-in .flex-sp{
	flex-wrap:wrap;
	max-width: 700px;
	margin: 0 auto;
}

.list-item li img,.price-in li img{
	width: 70px;
	height: 70px;
	vertical-align:middle;
}

.list-item-img{
	background-color: var(--lylw);
	border-radius: 50%;
	margin: 0.5em;
	padding: 10px;
}

.list-item li span,.price-in li span{
	display: block;
	margin-bottom:1em;
	font-weight:bold;
	color:var(--grn);
}


/*faq*/
#faq{background-color:var(--lpink);}

#faq dt,#faq dd{display: flex; line-height: 1.6;}

#faq dt{
	background-color: var(--pink);
    border-radius: 14px 14px 0 0;
    padding: 14px 20px;
    font-weight: bold;
    color: #FFF;
    font-size: 1.2rem;
}
#faq dd{margin:0 0 2em 0; padding: 14px 20px;}

#faq dt span,#faq dd span{
	display: block;
	padding-right:1em;
}

#faq dd span{
	color:var(--blue);
	font-size: 1.2rem;
	font-weight: bold;
}

#faq h3,#faq h4{text-align: center;}

#faq h3{font-size:1rem; color:var(--blue);}
#faq h4{font-size:1.4rem; color:var(--pink);}


/*footer*/

#footer_top{background-color:#FFF184;}
#footer_bottom{background: var(--blue);}

#copyright{right: 10px; top: 4px;}




/*serviceページ*/
#service-u .flex-sp{flex-wrap:wrap;}
#service-u .flex{align-items: center;}

#service-u li{
	margin:0 0.5em;
	width: 100%;
	max-width: 46%;
}

@media (max-width: 700px){
	#service-u li{max-width: 100%;}
}

img.smile{width:200px; padding-bottom:10px;}

#service-list{
	display: flex;
    flex-direction: column;
    align-items: center;
}

@media (max-width: 700px){
	#service-list .flex{align-items: center;}
}

.blue-tt{
	background-color: var(--blue);
    border-radius: 14px 14px 0 0;
    padding: 0.2rem 1.6rem;
    font-weight: bold;
    color: #FFF;
    font-size: 1.4rem;
	display: flex;
	align-items: center;
}

.blue-tt img{width:60px; padding-right:10px;}

#service-list dd{padding:2rem; margin:0;}

#service-list dd img{
	width:100%;
	max-width: 300px;
	max-height: 260px;
	object-fit: cover;
	border-radius: 14px;
	margin-right: 1rem;
}

@media (max-width: 700px){#service-list dd img{	margin-right: 0;}}

#service-list dl{
	position: relative;
	background-color: #FFF;
    margin: 2em auto;
	padding-bottom: 1em;
    border-radius: 14px;
    box-shadow: rgba(100,100,100,0.3) 3px 3px 10px;
	width: 100%;
	max-width:800px;
}

#service-list dd h3{color:var(--pink);}


.u-line{
	border-bottom: 2px dashed var(--pink);
	padding: 2em 0;
	margin-bottom: 1em;
}

.special-menu,.price-in{
	text-align: center;
	position: relative;
	border: solid 1px var(--pink);
	padding:1em;
	margin:1em;
	border-radius: 14px;
}

.special-menu{max-width:600px; margin:1em auto;}


.circle1{margin:0; padding:0; list-style-type: none;}

.twoline{padding-top: 4px;}

@media (max-width: 700px){
	/*.circle1{margin:2em 0 0 0;}*/
	.special-menu{padding:1em; margin:1em;}
	.special-menu .single-tt, .special-menu .single-price{font-size: 14px;}
}

.circle1 li,.circle2 li{
	background-color: var(--lylw);
    padding: 16px;
    border-radius: 50%;
    font-weight: bold;
    color: #333;
    margin: 0.2em;
	width: 50px;
    height: 50px;
}
.circle1 li:not(:first-child),.circle2 li{line-height: 50px;}

.special-menu h3,.price-in h3{
	display: inline-block;
	background-color: var(--pink);
	border-radius: 30px;
	padding:10px 20px;
	margin:0 auto;
	color:#FFF;
	position: absolute;
    width: 80%;
    top: -24px;
    left: 0;
    right: 0;
}

.special-menu h4{color:var(--blue); margin-bottom:0;}

.special-menu h4 span{font-size: 0.8rem;}

.special-menu h4 em{
	font-style: normal;
    font-size: 1.4rem;
    color: var(--pink);
}

.special-menu .single li{max-width:80%; margin:0 auto;}
@media (max-width: 700px){.special-menu .single li{max-width:100%;}}



/*priceページ*/

.price-tt h2{color:var(--blue); margin: 2em 0;}
.price-tt h2 span:not(.tt-small){font-size:1.2rem; color:var(--pink); display: block;}

.price-bg-tt h2{font-size:2rem;}

.price-bg-tt .tt-small{font-size:1.4rem; padding:0 6px;}

.price-in .price-in-list{
	list-style-type: none;
	padding: 3em 0 0 0;
	margin: 0 auto;
}

.price-in-list li span{color:var(--blue);}

.price-in .note-in{
	list-style-type:disc;
	padding-left: 1em;
}

.price-in .note{max-width: 800px; margin: 0 auto;}

#price p.price-pr{font-size:1.4rem; color:var(--blue); font-weight:bold; padding-top: 1em;}

/*swiper*/
.swiper{
  max-width:1920px;
}

.swiper-slide {
  overflow: visible;
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.swiper-slide img{
  width: 100%;
	height: auto;
	vertical-align: bottom;
}

.mainvisual {
  overflow-x: hidden;
  background-color: #F7E13C;
}

.mainvisual .pconly{margin-top:3%;}

.progressbar{
 position: relative;
 width: 100%;
max-width:1920px;
margin:0 auto;
 height: 7px;
 background: #ccc;
 overflow: hidden;
}
.progressbar span{
  display: inline-block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
right:0;
  width: 100%;
max-width:1920px;
  transform-origin: left center;
  background: #FFF184;
  transform: scaleX(0);
  transition-timing-function: linear;
}


/*会社概要*/

.post_content th{background:none;}
.post_content td, .post_content th{border:none;}

/* table */
.tbl-m tr {
  border-bottom: 2px solid #333;
}

.tbl-m th,
.tbl-m td {
  padding: 24px 0;
  border: none;
}

.tbl-m th {
	width: 30%;
	font-weight: bold;
}

/* sp */
@media only screen and (max-width: 600px) {
  .tbl-m th,
  .tbl-m td {
    width: 100%;
	  max-width:800px;
	  margin:0 auto;
    display: block;
	  padding:0;
  }

  .tbl-m th {
    width: 100%;
	text-align: left;
  }

  .tbl-m td {
    padding-top: 0;
  }
}


/*お問い合わせ*/
.wpcf7{
	border:none;
	background:none;
}

.wpcf7 input, .wpcf7 textarea {
	border: 1px solid #666;
	background-color: #fcfcfc;
}

.wpcf7-form label{
	font-weight: bold;
	color: var(--blue);
}

.wpcf7-form label span{color:red;}

.wpcf7 input.wpcf7-submit, .wpcf7 .wpcf7-previous{
	background-color: var(--blue);
	font-weight:bold;
	font-size:18px;
	height: 52px;
	border-radius: 8px;
	box-shadow: rgba(100,100,100,0.2) 6px 6px 0px;
}

.grecaptcha-badge {visibility: hidden;}

.note a{color:var(--blue);}

.wpcf7 input.p-postal-code{max-width:130px;}


/*lp-pack*/
.lp-pack{margin-top: 60px;}

@media (max-width: 770px){.lp-pack{margin-top: 116px;}}

.lp-pack #mv{background-color: #6FD4EF;}

.lp-pack #pr,.lp-pack #pack-plan{background-color:#FFFCCA;}

.lp-pack #mv h1{
	text-align: center;
	max-width: 1280px;
	margin: 0 auto;
}

.lp-pack #mv h1 img{width:100%;}

/*見出し*/

.lp-pack h2:not(.balloon h2),.lp-pack h3:first-child:not(.case-txt h3){text-align:center; margin: 3rem 0;}

@media (max-width: 800px){.lp-pack h2:not(.balloon h2),.lp-pack h3:first-child{text-align:center; margin: 0.5rem 0;}}

.lp-pack h2 img{
	width: 100%;
	max-width: 480px;
}

.lp-pack #pr h3{font-size:1.6rem;}

ul.sv li{
	display:flex;
	justify-content: center;
}

ul.sv li div{
	width: 50%;
	background-color: #fff;
    border: solid 4px #000;
    border-radius: 20px;
    padding: 20px;
    color: var(--pink);
    font-weight: bold;
    font-size: 1.2rem;
	margin:10px;
	text-align: center;
}

ul.sv li img{display: block; margin: 0 auto;}

@media (max-width: 800px){ul.sv li img{width:100px;}}

.lp-pack #lp-point{
	background-image: url(https://mokumokuchan.com/wp-content/uploads/2024/10/bg_blue.jpg);
	background-size: 200px,200px;
	background-repeat: repeat;
}


#lp-point li{
	padding: 2rem;
	border:solid 4px #000;
	border-radius:20px;
}


/*pack-plan*/
#pack-plan h2{padding-bottom:4rem;}

#pack-plan{background-color: var(--lylw);}

#pack-plan .packlist li{
	margin:10px;
	width: calc((100% - 6rem) / 3);
	text-align: center;
	background: #fff;
	border: solid 4px #000;
	border-radius: 24px;
	position: relative;
}

@media (max-width: 770px){
	#pack-plan .packlist li{width:calc(100% - 0.4rem); margin: 3rem auto;}
	ul.packlist{flex-direction: column;}
}

.packlist .balloon,#allin .balloon{
    text-align: center;
	background-color: var(--pink);
	border-radius: 50px;
	color: #fff;
	font-weight: bold;
	font-size: 1.1rem;
	padding: 0.5rem;
	max-width: 240px;
	margin: -3rem auto 0 auto;
	z-index: 3;
	position: relative;
	line-height: 1.4;
}

.packlist .balloon:before,#allin .balloon:before{border-top: 15px solid var(--pink);}

#allin .balloon{margin-top: 2rem;}

.packplan-tt{
    padding: 2.4rem 1rem 1rem 1rem;
    background-color: #333;
    border-radius: 18px 18px 0 0;
    margin-top: -18px;
    color: #fff;
    font-weight: bold;
    font-size: 1.6rem;
}

.packlist img{
	box-sizing: border-box;
	width:200px;
	height:140px;
}

.packlist h3{
	margin: 0 0 0.5rem 0;
	color:var(--blue);
	font-size: 18px;
}

.packlist h4{color:var(--pink); font-weight:bold; font-size:2rem; line-height: 1; padding-bottom: 1.4rem;}
.packlist h4 span{font-size:1.4rem;}

#pack-plan .single-wrap{
    width: 100%;
    margin: 0 auto;
    background-color: #fff;
    border-radius: 24px;
    border: solid 4px #000;
	text-align:center;
	margin: 2rem auto 0 auto;
}

#pack-plan .plan-tt{
	background-color:#333;
	border-radius:18px 18px 0 0;
}

#pack-plan .plan-tt+h3,#pack-plan h3.center{color:var(--blue);}

#pack-plan h4.center{font-size:1.4rem; line-height: 1.4;}

#pack-plan h4.center .pink-tt{font-size:1.6rem; padding: 0;}

#pack-plan .single-list{margin: 0;}

#allin ul{
	border:solid 4px #000;
	border-radius: 24px;
	padding: 2rem 1rem 1rem;
	display:flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: -1rem;
}

#allin ul li{
	margin-top:-1rem;
	text-align: center;
    width: 80px;
    height: 80px;
    background-color: #6FD4EF;
    border-radius: 18px;
    padding: 1rem;
    font-weight: bold;
    margin: 0.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

#allin ul li p{
	font-size: 1.2rem;
	color: #1B6089;
	line-height: 1.2;
}

#allin ul li p span{
	font-size: 0.8rem;
	display: block;
}

.lp-pack .balloon.bg-darkblue h2{color:#FCE435;}

.bg-darkblue{background-color:#1B6089;}
.balloon.bg-darkblue:before{border-top: 15px solid #1B6089;}

.lp-pack .info .flex{align-items: center;}

.lp-pack .tel a{
	width: 280px;
	font-size: 1.6rem;
	margin-bottom: 1.2rem;
	padding: 1.4rem 0.6rem;
	display: inline-block;
	border: solid 4px #000;
	border-radius: 10px;
	background-color: #F79234;
	color: #fff;
}

.lp-pack .tel a span{
	font-size: 1rem;
	display: block;
	color: #fff;
	margin: 0.5rem 0 0.3rem;
}

.lp-pack .mail a,.lp-pack .line a{border: solid 4px #000;}

.lp-pack .info .tel a{
	text-decoration: none;
    border-radius: 10px;
    box-shadow: rgba(100,100,100,0.2) 6px 6px 0px;
	font-weight: bold;
	min-width:180px;
}

.lp-pack .mail a,.lp-pack .line a{height:40px;}