@charset "utf-8";
/* CSS Document */

/*-- headline ------------------------------------------------------------*/
#headline { overflow-y: hidden; }
#headline h2 { color: #000; line-height: 1.0; letter-spacing: .1em; color: #057edb; margin-bottom: 5px;}
#headline h2 span.roboto { font-size: 1.5em; }
#headline h4 { text-align: center; font-weight: bold; font-size: 0.9rem; margin-bottom: 10px; }
#headline h5 { font-family:'Roboto Condensed', sans-serif; font-weight:bold; display:block; letter-spacing: 0em; color: rgba(5,126,219,0.3); }
#headline h6.mark { margin-bottom: 0px;}
@media screen and (max-width: 599px) {
	#headline .in { position: relative; }
	#headline .in .headline-image { position: absolute; left: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);}
	#headline .in .in-copy { position: absolute; top: 45%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); }
	#headline .in .in-copy h2,#headline .in .in-copy h5,#headline .in .in-copy h6 { text-align: center; }
	
	#headline .in { height: 120px; }
	.mark { text-align: center; margin:0 auto 0px; width: 30px; }
	#headline h2 { font-size: 1.2rem; letter-spacing: .05em;}
	#headline h4 { font-size: 0.7em; margin-bottom: 5px; }
	#headline h5 { font-size: 0.7em;}
	#headline .in .headline-image { width: 120px; }
	#headline .headlineR { position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); right: 0px; width: 80px; height: auto;}
}
@media screen and (min-width: 600px) {
	header nav { margin-bottom: 0px;}

	#headline .in { position: relative;
		-moz-box-shadow: -20px 0px 20px -10px rgba(0, 0, 0, 0.47);
		-webkit-box-shadow: -20px 0px 20px -10px rgba(0, 0, 0, 0.47);
		-ms-box-shadow: -20px 0px 20px -10px rgba(0, 0, 0, 0.47);
		box-shadow: -20px 0px 20px -10px rgba(0, 0, 0, 0.47);
	}
	#headline .in .headline-image { position: absolute; left: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); }
	#headline .in .in-copy { position: absolute; top: 45%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); }
	#headline .in .in-copy h2,#headline .in .in-copy h5,#headline .in .in-copy h6 { text-align: center; }
	
	#headline .headlineR { position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); right: 0px; width: 200px; height: auto;}
}
@media screen and (min-width: 600px) and (max-width: 899px)  {
	#headline .in { height: 230px; margin: 0 2%; }
	#headline h2 { font-size: 2.0rem;}
	#headline h6 { font-size: 0.8rem;}
	#headline .in .headline-image { width: 230px; }
	#headline .headlineR { width: 160px; }
}
@media screen and (min-width: 900px) and (max-width: 1079px)  {
	#headline .in { height: 240px; margin: 0 2%; }
	#headline h2 { font-size: 2.1rem;}
	#headline h6 { font-size: 0.85rem;}
	#headline .in .headline-image { width: 240px; }
	#headline .headlineR { width: 170px; }
}
@media screen and (min-width: 1080px) and (max-width: 1199px)  {
	#headline .in { height: 250px; margin: 0 2%; }
	#headline h2 { font-size: 2.2rem;}
	#headline h6 { font-size: 0.9rem;}
	#headline .in .headline-image { width: 250px; }
	#headline .headlineR { width: 180px; }
}
@media screen and (min-width: 1200px) and (max-width: 1479px)  {
	#headline .in { height: 260px; margin: 0 2%; }
	#headline h2 { font-size: 2.3rem;}
	#headline h6 { font-size: 0.95rem;}
	#headline .in .headline-image { width: 260px; }
	#headline .headlineR { width: 190px; }
}
@media screen and (min-width: 1480px) {
	#headline .in { 
		width: 1260px; margin: 0 auto; height: 270px;
		-moz-box-shadow: -20px 0px 20px -10px rgba(0, 0, 0, 0.47);
		-webkit-box-shadow: -20px 0px 20px -10px rgba(0, 0, 0, 0.47);
		-ms-box-shadow: -20px 0px 20px -10px rgba(0, 0, 0, 0.47);
		box-shadow: -20px 0px 20px -10px rgba(0, 0, 0, 0.47);
	}
	#headline h2 { font-size: 2.4rem;}
	#headline h6 { font-size: 1.0rem;}
}

/*-- breadcrumbs ------------------------------------------------------------*/
#breadcrumbs { margin-bottom: 20px;}
#breadcrumbs ul { display: flex; justify-content: flex-start; align-items: center; border-top: 1px solid #6dbde3; }
#breadcrumbs ul li { font-size: 0.8rem; background: #6dbde3; border-right: 1px solid #fff; padding: 1px 10px; color: #fff;}
#breadcrumbs ul li.current { background:#057edb; }
#breadcrumbs ul li a         { resize: none; color:#fff; display: block; }
#breadcrumbs ul li a:link    { color:#fff; text-decoration: none; }
#breadcrumbs ul li a:visited { color:#fff; text-decoration: none; }
#breadcrumbs ul li a:hover   { color:#057edb; text-decoration: none; }
#breadcrumbs ul li a:active  { color:#fff; text-decoration: none; }
@media screen and (max-width: 599px) {
	#breadcrumbs ul li { font-size: 0.7em; }
}
@media screen and (min-width: 600px) and (max-width: 899px)  {
	#breadcrumbs ul { margin: 0 2%; }
}
@media screen and (min-width: 900px) and (max-width: 1079px)  {
	#breadcrumbs ul { margin: 0 2%; }
}
@media screen and (min-width: 1080px) and (max-width: 1199px) {
	#breadcrumbs ul { margin: 0 2%; }
}
@media screen and (min-width: 1200px) and (max-width: 1479px)  {
	#breadcrumbs ul { margin: 0 2%; }
}
@media screen and (min-width: 1480px) {
	#breadcrumbs ul { width: 1260px; margin: 0 auto }
}

/*-- base ------------------------------------------------------------*/
.f_result .swiper-slide-card { opacity: 1.0;  }
@media screen and (max-width: 599px) {
	#content .in { font-size: 0.7em; padding: 0 4% 2%; }
	.f_result .subTtl01 {  }
	
	.in-flex-img { width: 60%; margin: 0 auto; }
}
@media screen and (min-width: 600px) {
	.f_result .subTtl01 { width: 100%; }
	#content .in main section#anch06 { margin-bottom: 60px; margin-top: 60px; }
	
	.in-flex-half { display: flex; justify-content:space-between; align-items: center;}
	.in-flex-half div { width: 48%;}
	
	.in-flex-60 { display: flex; justify-content:space-between; align-items: center;}
	.in-flex-60-L { width: 60%; margin-right: 4%; }
	.in-flex-60-R { width: 36%; }
	
	.in-in { margin: 0 2%; }
	
	.aboutHiromi { width: 36%; margin-right: 4%; }
	.aboutRight { width: 60%; }	
	.smileOff { display: flex; justify-content: space-between; align-items:center; }
}
@media screen and (min-width: 600px) and (max-width: 899px)  {
	#content .in { margin: 0 2%; width: 96%; }
	#content .in main { width: 100%; margin-right: 2%; }
	#content .in aside { width: 280px; }
}
@media screen and (min-width: 900px) and (max-width: 1079px)  {
	#content .in { margin: 0 2%; width: 96%; }
	#content .in main { width: 100%; margin-right: 2%; }
	#content .in aside { width: 320px; }
}
@media screen and (min-width: 1080px) and (max-width: 1199px) {
	#content .in { margin: 0 2%; width: 96%; }
	#content .in main { width: 100%; margin-right: 2%; }
	#content .in aside { width: 360px; }
}
@media screen and (min-width: 1200px) and (max-width: 1479px)  {
	#content .in { margin: 0 2%; width: 96%; }
	#content .in main { width: 100%; }
	#content .in aside { width: 380px; }
}
@media screen and (min-width: 1480px) {
	#content .in { width: 1260px; margin: 0 auto }
	#content .in main { width: 100%; }
	#content .in aside { width: 400px; }
}

/*-- content ------------------------------------------------------------*/
#mainContent .in { border-bottom: 1px solid #6dbde3;}
.moreBtn.moreBtn02 span { display: inline-block; margin-right: 5px; }
.moreBtn.moreBtn02 img { width: 25px; }
@media screen and (max-width: 599px) {
	#mainContent .in { padding: 2% 6%; }
	#mainContent .in .alC_pc { margin-bottom: 20px;}
}
@media screen and (min-width: 600px) {
	.lead-text { font-size: 1.1rem; margin-bottom: 40px; }
}
@media screen and (min-width: 600px) and (max-width: 899px)  {
	#mainContent .in { margin: 0 2% 40px; }
}
@media screen and (min-width: 900px) and (max-width: 1079px)  {
	#mainContent .in { margin: 0 2% 40px; }
}
@media screen and (min-width: 1080px) and (max-width: 1199px)  {
	#mainContent .in { margin: 0 2% 40px; }
}
@media screen and (min-width: 1200px) and (max-width: 1479px)  {
	#mainContent .in { margin: 0 2% 40px; }
}
@media screen and (min-width: 1480px) {
	#mainContent .in { width: 1260px; margin: 0 auto 40px; padding-bottom: 20px; } 
}


/*-- コンテンツ -------------------------------------------------------------*/
@media screen and (max-width: 599px) {	
	.searchBox { margin-bottom: 20px; }
	.searchBox .sbTtl { 
		text-align: center; font-weight: bold; font-size: 0.85rem; padding: 10px; max-width: 700px; width: 96%; margin: 0 auto; 
		color: #fff; background: #e17070; border-radius: 50px; cursor: pointer; position: relative; margin-bottom: 20px; 
	}
	.searchBox .sbTtl span { width: 60px; position: absolute; left: -15px; top: 10px; }
	.sbTtl:after { content: "\f107"; font-family: "Font Awesome 5 Free"; position: absolute; right: 6%; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); opacity: 0.5; font-size: 1.5em;}
	.sbTtl.active:after { content: "\f106"; }
	.sbContent { max-width: 660px; width: 88%; margin: 0 auto; border: 1px dashed #e17070; padding: 6%; border-radius: 12px; }
	.sbContent h6.fe_subttl { background: #f9e2e2; margin-bottom: 10px; padding: 5px 10px; border-top: 3px solid #f5b2b2; font-size: 0.9rem; }
	.fe_select { margin-bottom: 10px; }
	.fe_select h6 { font-size: 0.8rem;}
	.fe_select:last-child { margin-right: 0px; }
	.ff_box { margin-bottom: 10px; font-size: 0.8rem; }

}
@media screen and (min-width: 600px) {
	.searchBox { margin-bottom: 20px; }
	.searchBox .sbTtl { 
		text-align: center; font-weight: bold; font-size: 1.1rem; padding: 10px; max-width: 700px; width: 96%; margin: 0 auto; 
		color: #fff; background: #e17070; border-radius: 50px; cursor: pointer; position: relative; margin-bottom: 20px; 
	}
	.searchBox .sbTtl span { width: 70px; position: absolute; left: -25px; top: 3px; }
	.sbTtl:after { content: "\f107"; font-family: "Font Awesome 5 Free"; position: absolute; right: 4%; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); opacity: 0.5; font-size: 1.5em;}
	.sbTtl.active:after { content: "\f106"; }
	.sbContent { max-width: 660px; width: 92%; margin: 0 auto; border: 1px dashed #e17070; padding: 2%; border-radius: 12px; }
	.sbContent h6.fe_subttl { background: #f9e2e2; margin-bottom: 10px; padding: 5px 10px; border-top: 3px solid #f5b2b2; font-size: 0.9rem; }
	.fe_select { float: left; margin-right: 2%; width: 23.5%; margin-bottom: 20px; }
	.fe_select h6 { font-size: 0.8rem;}
	.fe_select:last-child { margin-right: 0px; }
	.ff_box { margin-bottom: 10px; font-size: 0.8rem; }

	.result_list li { margin-bottom: 40px; }
}
@media screen and (min-width: 600px) and (max-width: 1079px) {
	.searchBox .sbTtl { font-size: 0.9rem; }
}
/* card */
.result_list { margin: 0 auto; width: 100%; }
.result_list li { background:#fffcf0; padding: 20px 40px; border-radius: 12px; border: 1px solid #e9e2c9; margin-bottom: 40px; position: relative; }

.BeforeAfter { display: flex; justify-content: center; margin-bottom: 20px; position: relative; }

.BeforeAfter .before { width: 36%; margin-right: 4%; }
.BeforeAfter .before .before-frame { border: 0px solid #bce8fd; border-radius: 6px; width: 100%; height: auto; margin-bottom: 10px; position: relative; }
.BeforeAfter .before img { border-radius: 4px; }
.BeforeAfter .before .bText { content: ""; position: absolute; left: -3px; top: -3px; width: 0; height: 0; border-style: solid; border-width: 72px 72px 0 0; border-color: #bce8fd transparent transparent transparent; color: #5c80ad; font-size: 0.8rem; }
.BeforeAfter .before .bText span { transform: rotate(-45deg); font-family: 'Roboto',sans-serif; font-weight: bold; position: absolute; top: -55px; left: 3px;}

/*.BeforeAfter .before:after { content: "\f101"; font-family: 'Font Awesome 5 Free'; font-weight: 900; position: absolute; top: 50%; transform: translateY(-50%); right: -55px; color: #f1d6ad; font-size: 5.0rem; z-index: 10; }*/
.BeforeAfter .arrow { position: absolute; top: 45%; left: 33%; z-index: 10; transform: rotate(30deg); width: 10%; }

.BeforeAfter .after { width: 60%; height: auto; border: 0px solid #e17070; border-radius: 6px; position: relative; }
.BeforeAfter .after img { border-radius: 6px; }
.BeforeAfter .after .aText { content: ""; position: absolute; left: -6px; top: -6px; width: 0; height: 0; border-style: solid; border-width: 100px 100px 0 0; border-color: #e17070 transparent transparent transparent; color: #fff; }
.BeforeAfter .after .aText span { transform: rotate(-45deg); font-family: 'Roboto',sans-serif; font-weight: bold; position: absolute; top: -80px; left: 8px; font-size: 1.0rem; }
.result_list li h3 { text-align: center; padding: 5px 20px; border-top: solid 2px #f1d6ad; border-bottom: solid 2px #f1d6ad; margin-bottom: 10px; color: #000; font-size: 1.0rem; background: #fff; }

.inLine { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; margin-bottom: 5px; }
.inLine p { margin-right: 5px; font-weight: bold; font-size: 0.9em; }
.inLine p.xsmall { font-size: 0.7em; color: #666; }
.inLine p.xsmall .far { margin-right: 5px; }
.inLine p span { font-size: 0.8em; font-weight: normal; margin-right: 5px; }
.inLine p:after { content: "/"; margin-left: 5px; font-weight: normal;}
.inLine p:last-child:after { display: none; }

.comment { border: 1px dashed #333; padding: 10px 15px; border-radius: 8px; position: relative; width: 70%; margin-bottom: 10px  }
.comment dt { font-size: 0.8em; font-weight: bold; position: absolute; left: 2%; top: -20px; padding: 5px 10px; background:#fffcf0; }
.comment dd { font-size: 0.8em; }

.moreBtn { position: absolute; right: 4%; bottom:4%; margin: 0; text-align: center; }
.moreBtn span { font-size: 0.7em; display: block; }
.moreBtn img { width: 50px; }

.resultSingle { margin: 0 auto; background:#fffcf0; padding: 2%; border-radius: 12px; border: 1px solid #e9e2c9; margin-bottom: 40px; position: relative; }
.resultSingle .comment { width: 80%; margin: 0 10%; background: #fff;}
.resultSingle .resultTtl { background: #fff; padding-left: 60px; width: 93%; }

.result_sub_img { display: flex; justify-content: flex-start; flex-wrap: wrap; margin-bottom: 20px;  }
.result_sub_img li { width: 32%; }

.tblResult { width: 90%; margin: 0 auto; }
.tblResult th { padding: 10px; text-align: center; background: #fff2bd; border: 1px solid #e9e2c9; font-size: 0.9rem; }
.tblResult td { padding: 10px 15px; text-align: left; background: #fff; border: 1px solid #e9e2c9; font-size: 0.9rem; }

@media screen and (max-width: 599px) {
	.result_list li { padding: 4%; width: 100% !important; margin-bottom: 10px; }
	.result_list li h3 { font-size: 0.85rem; }
	.BeforeAfter .after .aText { border-style: solid; border-width: 75px 75px 0 0; }
	.BeforeAfter .after .aText span { top: -55px; left: 10px; font-size: 0.8em; }
	.BeforeAfter .before .bText span { font-size: 0.8em; left: 10px; top: -50px; }
	.comment { width: 86%; margin-right: 0%;  }
	.inLine p { line-height: 1.2; font-size: 0.7rem; }
	
	.moreBtn { position: inherit; display: flex; justify-content: flex-end; align-items: center; }
	.moreBtn span { font-size: 0.7em; display: inline-block; order: 1; margin-right: 5px; }
	.moreBtn img { width: 30px; order: 2; }
	
	.resultSingle { width: 92%; padding: 4%; }
	.result_sub_img li { width: 32%; margin-right: 2%; margin-bottom: 10px; }
	.result_sub_img li:nth-child(3n) { margin-right: 0px; }
	
	.tblResult { width: 100%; }
	.resultSingle .resultTtl { padding-left: 50px; }
}
@media screen and (min-width: 600px) and (max-width: 1079px) {
	.result_list { display: flex; justify-content: flex-start; flex-wrap: wrap; }
	.result_list li { width: 49%; margin-right: 2%; margin-bottom: 20px; padding: 2% 2%; }
	.result_list li:nth-child(2n) { margin-right: 0px;}
	.result_list li h3 { font-size: 0.95rem;}
	.BeforeAfter .after .aText { border-width: 80px 80px 0 0; }
	.BeforeAfter .after .aText span { top: -65px; left: 7px; font-size: 0.8rem; }
	
	.BeforeAfter .before .bText { border-width: 60px 60px 0 0; font-size: 0.5rem;}
	.BeforeAfter .before .bText span { position: absolute; top: -45px; left: 6px;}
	.comment { width: 70%; margin-right: 4%;  }
	.moreBtn span { font-size: 0.6em; }
	.moreBtn img { width: 30px; }
	.inLine p { line-height: 1.2; font-size: 0.8rem; }
	
	.result_sub_img li { width: 23.5%; margin-right: 2%; margin-bottom: 10px; }
	.result_sub_img li:nth-child(4n) { margin-right: 0px; }
}
@media screen and (min-width: 1080px) and (max-width: 1199px) {
	.result_list { display: flex; justify-content: flex-start; flex-wrap: wrap; }
	.result_list li { width: 49%; margin-right: 2%; margin-bottom: 20px; padding: 2% 2%; }
	.result_list li:nth-child(3n) { margin-right: 0px; }
	
	.result_sub_img li { width: 23.5%; margin-right: 2%; margin-bottom: 10px; }
	.result_sub_img li:nth-child(5n) { margin-right: 0px; }
	
	.result_list li .comment { width: 65%; }
	.result_list li .moreBtn span { font-size: 0.6em; display: block; }
	.result_list li .moreBtn img { width: 40px; }
}
@media screen and (min-width: 1200px) {
	.result_list { display: flex; justify-content: flex-start; flex-wrap: wrap; }
	.result_list li { width: 32%; margin-right: 1%; margin-bottom: 20px; padding: 2% 2%; }
	.result_list li:nth-child(3n) { margin-right: 0px; }
	
	.result_sub_img li { width: 15.8%; margin-right: 1%; margin-bottom: 10px; }
	.result_sub_img li:nth-child(6n) { margin-right: 0px; }
	
	.tblResult th { width: 20%; }
	
	.result_list li .comment { width: 65%; }
	.result_list li .moreBtn span { font-size: 0.6em; display: block; }
	.result_list li .moreBtn img { width: 40px; }
}

.result_list li a         { resize: none; }
.result_list li a:link    { color:#000; text-decoration: none; }
.result_list li a:visited { color:#000; text-decoration: none; }
.result_list li a:hover   { color:#000; text-decoration: none; opacity: 0.7; }
.result_list li a:active  { color:#000; text-decoration: none; }

.arrow-ani { position:relative; color:#333; padding: 5px 0; display:inline-block; text-decoration: none; outline: none; width: 80%;}
.arrow-ani span { font-size: 0.9em;}
.arrow-ani span.aColor { color: #e17070;}
.arrow-ani span.bColor { color: #5c80ad;}
.arrow-ani::before { content: ""; position: absolute; bottom: 0; width: 100%; height: 1px; background: #5c80ad; }
.arrow-ani::after { content: ""; position: absolute; bottom:-4px; width: 8px; height: 8px; border-top: 1px solid #e17070; border-right: 1px solid #e17070; transform: rotate(45deg); }
.arrow-ani::before { animation: arrowlong01 2s ease infinite; }
.arrow-ani::after { animation: arrowlong02 2s ease infinite; }
@keyframes arrowlong01 {
    0%{ width:0; opacity:0}
    20%{ width:0; opacity:1}
    80%{ width:105%; opacity:1}
    100%{ width:105%; opacity:0}
}
@keyframes arrowlong02 {
    0%{ left:0; opacity:0}
    20%{ left:0; opacity:1}
    80%{ left:103%; opacity:1}
    100%{ left:103%; opacity:0}
}
@media screen and (max-width: 599px) {
	.arrow-ani span { font-size: 0.8em;}
}

/*-- manufest -------------------------------------------------------------*/
@media screen and (max-width: 599px) {	
	.manufest_box { margin: 0 6%; width: 88%; }
	.manufest_box li { 
		margin-bottom: 20px; padding: 4%; border-top: 1px solid #ffedbb; border-bottom: 1px solid #ffedbb; position: relative; 
		background: #fffcf3;background-image:repeating-linear-gradient(-45deg,#fffbd9, #fffbd9 7px,transparent 0, transparent 14px);
	}
	.manufest_box li p { font-size: 1.1rem; color: #1d50a2; font-weight: bold; font-family: "Kaisei Tokumin", serif; font-weight: 700; text-align: center; margin-bottom: 0px; }
	.manufest_box li div { width: 80%; margin: 0 10%; }
	.manufest_box li .no { position: absolute; top: -10px; left: -60px; width: 70px; }
	.manufestSec p.alC_pc { margin-bottom: 40px;}
}
@media screen and (min-width: 600px) {
	.manufest_box { margin: 0 auto; width: 100%; }
	.manufest_box li { 
		display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding: 10px 2% 10px 8%; border-top: 1px solid #ffedbb; border-bottom: 1px solid #ffedbb; position: relative; 
		background: #fffcf3;background-image:repeating-linear-gradient(-45deg,#fffbd9, #fffbd9 7px,transparent 0, transparent 14px);
	}
	.manufest_box li p { width: 70%; font-size: 1.5rem; color: #1d50a2; font-weight: bold; font-family: "Kaisei Tokumin", serif; font-weight: 700;}
	.manufest_box li div { width: 30%;}
	.manufest_box li .no { position: absolute; top: -10px; left: -30px; width: 100px; }
}
@media screen and (min-width: 600px) and (max-width: 899px) {
	.manufest_box { margin: 0 2%; width: 96%; }
	.manufest_box li { padding-left: 14%; }
	.manufest_box li p {font-size: 1.3rem; }
	.manufest_box li .no { width: 80px; left: -25px; }
}
@media screen and (min-width: 900px) and (max-width: 1079px) {
	.manufest_box { margin: 0 2%; width: 96%; }
	.manufest_box li { padding-left: 12%; }
	.manufest_box li p {font-size: 1.4rem; }
	.manufest_box li .no { width: 90px; left: -20px; }
}
@media screen and (min-width: 1080px) and (max-width: 1199px) {
	.manufest_box li { padding-left: 10%; }
}
/*-- flow -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.flowBox { }
	.flowBox li {
		margin-bottom: 20px; padding: 4%; /*border-top: 1px solid #ffedbb;*/ border-bottom: 1px solid #ffedbb; position: relative; 
		background: #fafeff;background-image:repeating-linear-gradient(-45deg,#edfdff, #edfdff 7px,transparent 0, transparent 14px);	
	}
	.flowBox li .no { position: absolute; top: -10px; left: -30px; width: 70px; }
	.flowBox li h3 { position: relative; padding: 10px 30px; background: #56cbf9; font-weight: bold; margin-bottom: 20px; border-top: 3px solid #329dc7; color: #fff; }
	.flowBox li h3:after { position: absolute; content: ''; top: 100%; left: 30px; border: 15px solid transparent; border-top: 15px solid #56cbf9; width: 0; height: 0;}
	
	.in-flex .in-flex-R { width: 50%; margin: 0 25%; }
}
@media screen and (min-width: 600px) {
	.flowBox { }
	.flowBox li {
		margin-bottom: 20px; padding: 10px 2% 10px 8%; /*border-top: 1px solid #88baff;*/ border-bottom: 1px solid #88baff; position: relative; 
		background: #fafeff;background-image:repeating-linear-gradient(-45deg,#edfdff, #edfdff 7px,transparent 0, transparent 14px);		
	}
	.flowBox li .no { position: absolute; top: -10px; left: -30px; width: 100px; }
	.flowBox li h3 { position: relative; padding: 10px 30px; background: #56cbf9; font-weight: bold; margin-bottom: 20px; border-top: 3px solid #329dc7; color: #fff; }
	.flowBox li h3:after { position: absolute; content: ''; top: 100%; left: 30px; border: 15px solid transparent; border-top: 15px solid #56cbf9; width: 0; height: 0;}
	
	.in-flex { display: flex; justify-content: space-between; align-items: center; }
	.in-flex .in-flex-L { width: 70%; }
	.in-flex .in-flex-R { width: 30%; }
}
@media screen and (min-width: 600px) and (max-width: 899px) {
	.flowBox li { padding-left: 14%; }
	.flowBox li .no { position: absolute; top: -10px; left: -25px; width: 80px; }
}
@media screen and (min-width: 900px) and (max-width: 1079px) {
	.flowBox li { padding-left: 12%; }
	.flowBox li .no { position: absolute; top: -10px; left: -20px; width: 90px; }
}
@media screen and (min-width: 1080px) and (max-width: 1199px) {
	.flowBox li { padding-left: 10%; }
}
/*-- FAQ -------------------------------------------------------------*/
@media screen and (max-width: 599px) {	
	.faq_box　{ margin-bottom: 10px; }
	.faq_box dt { color: #e44; font-weight: bold; margin-bottom: 10px; font-size: 0.9rem; background: #fff5f5; cursor: pointer; position: relative; padding:5px 8% 5px 2em; text-indent: -1.5em; }
	.faq_box dt:before { content:"Q."; font-family:'Roboto Condensed', sans-serif; font-weight:bold; margin-right: 5px; font-size: 1.0rem; }
	.faq_box dt:after { content: "\f067"; font-family: "Font Awesome 5 Free"; font-weight: 900; position: absolute; right: -1%; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); opacity: 0.5; }
	.faq_box dt.active:after { content: "\f068"; }
	.faq_box dd { padding: 0px; border-radius: 8px; margin-bottom: 20px; font-size: 0.9rem;}
}
@media screen and (min-width: 600px) {
	.faq_box { margin:0 2%; }
	.faq_box dt { color: #e44; font-weight: bold; margin-bottom: 10px; font-size: 1.1rem; background: #fff5f5; padding: 10px 20px; cursor: pointer; position: relative; }
	.faq_box dt:before { content:"Q."; font-family:'Roboto Condensed', sans-serif; font-weight:bold; margin-right: 5px; font-size: 1.35rem; }
	.faq_box dt:after { content: "\f067"; font-family: "Font Awesome 5 Free"; font-weight: 900; position: absolute; right: 1%; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); opacity: 0.5; }
	.faq_box dt.active:after { content: "\f068"; }
	.faq_box dd { padding: 20px; border-radius: 8px; margin-bottom: 20px;}
}

/*-- voice -------------------------------------------------------------*/
.letter_box { background:#fffcf0; padding: 2% 2%; border-radius: 12px; border: 1px solid #e9e2c9; position: relative; }
.letter_box h4 { font-weight: bold; margin-bottom: 10px; }
.letter_box a         { resize: none; }
.letter_box a:link    { color:#0089ff; text-decoration: none; }
.letter_box a:visited { color:#0089ff; text-decoration: none; }
.letter_box a:hover   { color:#0089ff; text-decoration: underline; }
.letter_box a:active  { color:#0089ff; text-decoration: none; }

@media screen and (max-width: 599px) {	
	.letter_box { margin-bottom: 20px; padding: 4%;  }
	.letter_box .img_t_R { float: none; width: 50%; margin: 0 25% 20px; }
	.letter_box h4 { text-align: center; }
	.back_voice_box { border: #CC9966 2px solid; background: #fff; border-radius: 4px; padding: 10px 20px; }
	.back_voice_box p { background: url(../img/second/voice_dog_icon.png) 0px 0px no-repeat; padding-left: 65px; color: #0066FF; font-size: 0.8rem; margin-bottom: 0px; background-size: 50px; }
}
@media screen and (min-width: 600px) {
	.l_b_flex { }
	.back_voice_box { border: #CC9966 2px solid; background: #fff; border-radius: 4px; padding: 10px 20px; }
	.back_voice_box p { background: url(../img/second/voice_dog_icon.png) 0px 0px no-repeat; padding-left: 85px; color: #0066FF; font-size: 0.9rem; margin-bottom: 0px; }
}
@media screen and (min-width: 600px) and (max-width: 899px) {
	.letter_box { width: 100%; margin-bottom: 40px; }
}
@media screen and (min-width: 900px) {
	.letter_box { margin-bottom: 40px; }
}

/*-- choice -------------------------------------------------------------*/
.memo ul li { font-family: "Hina Mincho", serif; font-weight: 400; font-style: normal;}
@media screen and (max-width: 599px) {
	.memo { background:#fffcf0; padding: 4%; border-radius: 12px; border: 1px solid #e9e2c9; position: relative; margin-bottom: 40px;  }
	.memo h4 { background: #dfefff; box-shadow: 0px 0px 0px 5px #dfefff; border: dashed 1px #96c2fe; padding: 0.5em 1.0em; color: #000; margin-bottom: 20px; font-weight: bold; }	
	.memo ul li { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dashed #ccc; background: url("../img/second/icon_pen.png") 0 0 no-repeat; padding-left: 40px; background-size: 30px; font-weight: bold; }
	.memo ul li:last-child { margin-bottom: 0px; }
	
	.choiceBox li { border-top:1px solid #69c3ad; border-bottom:1px solid #69c3ad;}
	.choiceBox li h3 { position: relative; padding: 0.5em 2em; background: #69c3ad; color: white; border-top: none; margin-bottom: 30px; }
	.choiceBox li h3::before { position: absolute; content: ''; top: 100%; left: 0; border: none; border-bottom: solid 15px transparent; border-right: solid 20px rgb(149, 158, 155);}
	.choiceBox li h3::after { display: none; }
}
@media screen and (min-width: 600px) {
	.choiceSec { max-width: 900px; margin: 0 auto; width: 100%; }
	.memo { background:#fffcf0; padding: 2% 2%; border-radius: 12px; border: 1px solid #e9e2c9; position: relative; margin-bottom: 40px;  }
	.memo h4 { background: #dfefff; box-shadow: 0px 0px 0px 5px #dfefff; border: dashed 1px #96c2fe; padding: 0.5em 1.0em; color: #000; margin-bottom: 20px; font-weight: bold; }	
	.memo ul li { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dashed #ccc; background: url("../img/second/icon_pen.png") 0 0 no-repeat; padding-left: 40px; background-size: 30px; font-weight: bold; }
	.memo ul li:last-child { margin-bottom: 0px; }
	
	.choiceBox li { border-top:1px solid #69c3ad; border-bottom:1px solid #69c3ad;}
	.choiceBox li h3 { position: relative; padding: 0.5em 1em; background: #69c3ad; color: white; border-top: none; }
	.choiceBox li h3::before { position: absolute; content: ''; top: 100%; left: 0; border: none; border-bottom: solid 15px transparent; border-right: solid 20px rgb(149, 158, 155);}
	.choiceBox li h3::after { display: none; }
}

/*-- cost -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.ttl02 { position: relative; padding: 0.5em 2em; background: #69c3ad; color: white; border-top: none; margin-bottom: 30px; }
	.ttl02::before { position: absolute; content: ''; top: 100%; left: 0; border: none; border-bottom: solid 15px transparent; border-right: solid 20px rgb(149, 158, 155);}
	.ttl02::after { display: none; }
	.ttl02.meritTtl { background:#e69b37; color:#fff; }
	.ttl02.demeritTtl { background:#2d50a0; color:#fff; }
	
	.tbl01 { width: 100%; margin: 0 auto 20px; }
	.tbl01 th { background: #f4f4f4; border: 1px solid #dedede; padding: 10px; text-align: center; width: 50%; font-size: 0.8rem; }
	.tbl01 td { background: #fff; border: 1px solid #dedede; padding: 10px; text-align: center; width: 50%; font-size: 0.8rem; }
	.tbl01 td .roboto { font-size: 1.0rem; margin-right: 5px;}
	.tbl01 caption { margin-bottom: 10px; text-align: left; font-weight: bold; font-size: 1.0rem; color: #2d50a0; }
	.tbl01 caption:before { content: "■"; margin-right: 10px;}
	
	.cost_img_box { margin-bottom: 20px; }
	.cost_img_box li { text-align: center; margin-bottom: 10px; }
	
	.cost_point_box { background: #fffcf0; padding: 2% 2%; border-radius: 12px; border: 1px solid #e9e2c9; position: relative; margin-bottom: 20px; }
	.cost_point_box_L { width: 40%; margin: 0 auto 20px; }
	.cost_point_box_R { }
	
	.tbl01.tbl02 th { width: 33%;}
	.tbl01.tbl02 td { width: 33%;}
	
	.dlGreen { margin-bottom: 20px;}
	.dlGreen dt { border-left: 8px solid #2d50a0; padding: 5px 20px; border-bottom: 1px dotted #ccc; margin-bottom: 10px; font-weight: bold; }
}
@media screen and (min-width: 600px) {
	.costSec { max-width: 900px; margin: 0 auto; width: 100%; }
	.ttl02 { position: relative; padding: 0.5em 1em; background: #69c3ad; color: white; border-top: none; margin-bottom: 30px; font-weight: bold; font-size: 1.1rem; }
	.ttl02::before { position: absolute; content: ''; top: 100%; left: 0; border: none; border-bottom: solid 15px transparent; border-right: solid 20px rgb(149, 158, 155);}
	.ttl02::after { display: none; }
	.ttl02.meritTtl { background:#e69b37; color:#fff; }
	.ttl02.demeritTtl { background:#2d50a0; color:#fff; }
	
	.tbl01 { width: 100%; margin: 0 auto 40px; }
	.tbl01 th { background: #f4f4f4; border: 1px solid #dedede; padding: 10px; text-align: center; width: 50%; }
	.tbl01 td { background: #fff; border: 1px solid #dedede; padding: 10px; text-align: center; width: 50%; }
	.tbl01 td .roboto { font-size: 1.2rem; margin-right: 5px;}
	.tbl01 caption { margin-bottom: 10px; text-align: left; font-weight: bold; font-size: 1.1rem; color: #2d50a0; }
	.tbl01 caption:before { content: "■"; margin-right: 10px;}
	
	.cost_img_box { display: flex; justify-content:flex-start; margin-bottom: 20px; }
	.cost_img_box li { margin-right: 2%; }
	
	.cost_point_box { background: #fffcf0; padding: 2% 2%; border-radius: 12px; border: 1px solid #e9e2c9; position: relative; margin-bottom: 40px; display: flex; justify-content: space-between; align-items: center; }
	.cost_point_box_L { width: 20%; }
	.cost_point_box_R { width: 76%; }
	
	.tbl01.tbl02 th { width: 33%;}
	.tbl01.tbl02 td { width: 33%;}
	
	.dlGreen { margin-bottom: 20px;}
	.dlGreen dt { border-left: 8px solid #2d50a0; padding: 5px 20px; border-bottom: 1px dotted #ccc; margin-bottom: 10px; font-weight: bold; }
}

/*-- process -------------------------------------------------------------*/
@media screen and (max-width: 599px) {

}
@media screen and (min-width: 600px) {
	.processSec { max-width: 900px; margin: 0 auto; width: 100%; }
}

/*-- trouble -------------------------------------------------------------*/
@media screen and (max-width: 599px) {

}
@media screen and (min-width: 600px) {
	.troubleSec { max-width: 900px; margin: 0 auto; width: 100%; }
}

/*-- company -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.tbl02 { width: 100%; margin: 0 auto 40px; border-top: 1px solid #dedede; }
	.tbl02 th { border-bottom: 1px dotted #dedede; padding: 2% 4%; text-align: center; display: block; }
	.tbl02 td { border-bottom: 1px solid #dedede; padding: 2% 4%; text-align: left; display: block;}
}
@media screen and (min-width: 600px) {
	.tbl02 { width: 100%; margin: 0 auto 40px; }
	.tbl02 th { border-bottom: 3px solid #dedede; padding: 15px; text-align: center; width: 25%; }
	.tbl02 td { border-bottom: 1px solid #dedede; padding: 15px; text-align: left; width: 75%; }
}

/*-- value -------------------------------------------------------------*/
@media screen and (max-width: 599px) {

}
@media screen and (min-width: 600px) {
	.tbl03 { width: 100%; margin: 0 auto 40px; }
	.tbl03 th { width: 25%; text-align: center; vertical-align: middle; }
	.tbl03 td { text-align: left; width: 75%; }
}
/*-- privacy -------------------------------------------------------------*/
.privacy dt { font-weight: bold; }
.privacy dd { margin-bottom: 20px; }

/*-- area -------------------------------------------------------------*/
#content .in main section.aboutSmileSec.areaBox { margin-top: 0px !important; padding: 0px; border: none; background: #fff; }
#content .in main section.aboutSmileSec.areaBox .aboutSmileFlex { align-items: flex-start; }

@media screen and (min-width: 600px) and (max-width: 899px) {
	#content .in main section.aboutSmileSec.areaBox .aboutSmileFlex .aboutRight { width: 100%; }
}

/*-- boutry -------------------------------------------------------------*/
.boutryList li { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dotted #ccc; }
.bCate { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 10px; }
.bCate dt { display: flex; justify-content: flex-start; align-items: center; color: #fff; background: #057edb; border-right: 1px solid #fff; font-size: 12px; height: 25px; line-height: 25px; padding: 0 10px; }
.bCate dd { color: #fff; background: #333; height: 25px; line-height: 25px; padding: 0 10px; font-size: 12px; }

.boutryList li a         { resize: none; }
.boutryList li a:link    { color:#057edb; text-decoration: underline; }
.boutryList li a:visited { color:#057edb; text-decoration: underline; }
.boutryList li a:hover   { color:#333333; text-decoration: underline; }
.boutryList li a:active  { color:#057edb; text-decoration: underline; }