@charset "UTF-8";

section:nth-child(odd) { background: #f5f5ee; }
@media screen and (max-width: 599px) {
	section .in { width: 88%; margin: 0 auto; padding: 6%;}
	.ttl01 { text-align: center; font-size: 1.6em; font-weight: 700; }
	.ttl01 .xxsmall { font-size: 0.6em; }
	.decoTtl { text-align: center; color: var(--base-color); margin-bottom: 3vh; font-size: 0.8em; }
	.decoMark { text-align: center; width: 30px; margin: 0 auto; }
	#anch06 .decoMark { text-align: center; width: 80px; margin: 0 auto; }
	#anch07 { padding: 5vh 0; }
}
@media screen and (min-width: 600px) {
	section { padding: 5vh; }
	section .in { max-width: 1400px; width: 96%; margin: 0 auto; padding: 0 2%;}
	.ttl01 { text-align: center; font-size: 2.0em; font-weight: 700; }
	.ttl01 .xxsmall { font-size: 0.6em; }
	.decoTtl { text-align: center; color: var(--base-color); margin-bottom: 5vh; }
	.decoMark { text-align: center; }
	
}
@media screen and (min-width: 600px) and (max-width: 899px) {
	section { padding: 3vh; }
	#anch06 .decoMark { text-align: center; width: 120px; margin: 0 auto; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
}
@media screen and (min-width: 1390px) and (max-width: 1489px) {
}
@media screen and (min-width: 1490px) {
}

/*-- list  -------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	.strongList { width: 90%; margin: 0 auto;}
	.strongList li { margin: 0 0 40px; position: relative; }
	.listTtl { text-align: center; font-size: 1.05em; margin-bottom: 10px; font-weight: 700; display: flex; justify-content: center; align-items: center; flex-direction: column; flex-wrap: nowrap; line-height: 1.7; position: relative; z-index: 1; }
	.listTtl span { display: contents; }
	.strongList li div { margin-bottom: 20px; }
	
	.stDl { position: absolute; top: -10px; left: 10px; background: var(--sub-color); min-width: 50px; overflow: hidden;}
	.stDl dt { font-size: 0.7em; padding: 15px 0px 5px; border-bottom: 1px solid #fff; margin: 0 10px 5px 10px; color: #fff; text-align: center; }
	.stDl dd { font-size: 1.8em; line-height: 1.0; text-align: center; color: #fff; font-weight: 700; }
	
	.listTtl .en { position: absolute; top: -30px; left: 50%; z-index: -1; transform: translateX(-50%); color: #eae9e9; display: block; font-size: 2.1em; keep-all; white-space: nowrap; }
}
@media screen and (min-width: 768px) {
	.strongList { display: flex; justify-content: center; flex-wrap: wrap; }
	.strongList li { width: 29%; margin: 0 2% 40px; position: relative; }
	.listTtl { text-align: center; font-size: 1.2em; margin-bottom: 20px; font-weight: 700; display: flex; justify-content: center; align-items: center; flex-direction: column; flex-wrap: nowrap; position: relative; z-index: 1; }
	.listTtl span { display: contents; }
	.strongList li div { margin-bottom: 20px; }
	.stDl { position: absolute; top: -10px; left: 10px; background: var(--sub-color); min-width: 70px; overflow: hidden;}
	.stDl dt { font-size: 0.7em; padding: 15px 0px 5px; border-bottom: 1px solid #fff; margin: 0 10px 5px 10px; color: #fff; text-align: center;}
	.stDl dd { font-size: 1.8em; line-height: 1.0; text-align: center; color: #fff; font-weight: 700; }
	
	.listTtl .en { position: absolute; top: -40px; left: 50%; z-index: -1; transform: translateX(-50%); color: #eae9e9; display: block; font-size: 2.1em; word-break: keep-all; white-space: nowrap; }
}
@media screen and (min-width: 768px) and (max-width: 899px) {
	.strongList li { width: 40%; margin: 0 2% 40px; }
	.strongList li:nth-child(3) { width: 40%; margin: 0 30% 40px; }
	.listTtl { font-size: 1.1em; }
	.listTtl .en { font-size: 1.5em;}
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	.strongList li { width: 40%; margin: 0 2% 40px; }
	.strongList li:nth-child(3) { width: 40%; margin: 0 30% 40px; }
	.listTtl { font-size: 1.1em; }
	.listTtl .en { font-size: 1.5em;}
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
	.listTtl { font-size: 1.1em; }
	.listTtl .en { font-size: 1.5em;}
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
	.listTtl { font-size: 1.1em; }
	.listTtl .en { font-size: 1.5em;}
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
	.listTtl { font-size: 1.1em; }
	.listTtl .en { font-size: 1.6em;}
}
@media screen and (min-width: 1390px) and (max-width: 1489px) {
	.listTtl .en { font-size: 1.8em;}
}
@media screen and (min-width: 1490px) {
}

/*-- kadai  -------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	.kadaiDl { margin-bottom: 20px; background: #ffffff; padding: 20px; border-radius: 4px; }
	.kadaiDl dt { margin-bottom: 10px; background: url("../img/common/nayami.png") left top no-repeat; background-size: 30px; padding: 0px 10px 10px 40px; color: var(--base-color); border-bottom: 2px solid var(--base-color); font-size: 1.1em; margin-bottom: 10px; font-weight: 700;}
	.kadaiDl dd { padding: 10px 10px 0; }
}
@media screen and (min-width: 768px) {
	.in-max1000 { max-width: 1000px; margin: 0 auto; }
	.kadaiDl { margin-bottom: 20px; background: #ffffff; padding: 20px; border-radius: 4px; width: 90%; position: relative; }
	.kadaiDl dt { margin-bottom: 10px; background: url("../img/common/nayami.png") left center no-repeat; background-size: 30px; padding-left: 30px; position: relative; z-index: 2;}
	.kadaiDl dt span { padding: 10px; color: var(--base-color); border-bottom: 2px solid var(--base-color); font-size: 1.1em; margin-bottom: 10px; font-weight: 700;}
	.kadaiDl dd { padding: 10px 10px 0; position: relative; z-index: 2; }
	.kadaiDl:nth-child(odd) { margin-left: 10%; }
	.kadaiDl:before {
        content: "";
        position: absolute;
        top: 0%;
        right: 0%;
        background: #fff;
        width: 100%;
        height: 100%;
        z-index: 1;
        border-radius: 8px;
	}
	.kadaiDl:after {
        content: "";
        position: absolute;
        top: 10px;
        right: -10px;
        background: #dedede;
        width: 100%;
        height: 100%;
        z-index: -1;
        border-radius: 8px;
	}
}
@media screen and (min-width: 768px) and (max-width: 899px) {
	.kadaiDl { width: 80%; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
}
@media screen and (min-width: 1390px) and (max-width: 1489px) {
}
@media screen and (min-width: 1490px) {
}

/*-- ポイント -------------------------------------------------------------*/
.fa-external-link-alt { opacity: 0.5; }
@media screen and (max-width: 767px) {
	.in-flex { display: flex; justify-content: space-between; align-items: center; flex-direction: column; margin-bottom: 5vh; }
	.in-flex:last-child { margin-bottom: 0px; }
	.in-flex .in-flex-Img { width: 100%; position: relative; order: 1; margin-bottom: 40px; }
	.in-flex .in-flex-Txt { width: 100%; order: 2; }
	.in-flex .in-flex-Txt .ttl02 { text-align: center; margin-bottom: 10px; font-weight: 700; font-size: 1.05em; }
	.in-flex .in-flex-Txt .ttl02 span { display: block; }
	.in-flex .in-flex-Img:after { content: ""; position: absolute; bottom: -10px; right: -10px; background: var(--opa-color); width: 96%; height: 100%; z-index: -1;}
	
	.lead { text-align: center; margin-bottom: 20px;}
	
	.in-flex-Txt ul li { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dotted #dedede; font-size: 0.95em; }
	.in-flex-Txt ul li:before { content: "\f0da"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 10px; color: var(--base-color); }
	.in-flex-Txt p { margin-bottom: 20px; }
	
	.thirdFlex { margin-bottom: 5vh; }
	.thirdFlex li { padding-bottom: 10px; margin-bottom: 30px; }
	
	.fifthFlex {  margin-bottom: 5vh; }
	.fifthFlex li { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dotted #dedede; }
	.fifthFlex li div { margin-bottom: 20px; }
	.fifthFlex li .listTtl { margin-bottom: 10px; color: var(--base-color); font-size: 1.1em; }
	
	.listIcon { width: 100px; margin: 0 auto 20px;}
	.subMark { line-height: 1.0; margin-bottom: 10px !important; font-size: 0.8rem; text-align: center; }
	.subMark span.smBg { background: var(--base-color); color: #fff; padding: 1px 10px; line-height: 1.0; font-size: 0.8em; }
	
	.jsox-zu { width: 80%; margin: 0 auto; }
}
@media screen and (min-width: 768px) {
	.in-flex { display: flex; justify-content: space-between; align-items: center; margin-bottom: 5vh; }
	.in-flex:last-child { margin-bottom: 0px; }
	.in-flex .in-flex-Img { width: 36%; position: relative; }
	.in-flex .in-flex-Txt { width: 60%; }
	
	.in-flex .in-flex-Img02 { width: 26%; position: relative; }
	.in-flex .in-flex-Txt02 { width: 70%; }
	
	.in-flex .in-flex-Txt .ttl02 { text-align: left; margin-bottom: 10px; font-size: 1.2em; font-weight: 700; color: var(--base-color); }
	.in-flex .in-flex-Img:after { content: ""; position: absolute; bottom: -10px; right: -10px; background: var(--opa-color); width: 100%; height: 100%; z-index: -1;}
	.lead { text-align: center; margin-bottom: 40px;}
	
	.in-flex-Txt ul li { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dotted #dedede; font-size: 0.95em; }
	.in-flex-Txt ul li:before { content: "\f0da"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 10px; color: var(--base-color); }
	.in-flex-Txt p { margin-bottom: 20px; }
	
	.thirdFlex { display: flex; justify-content: space-between; margin-bottom: 40px; }
	.thirdFlex li { width: 31%; }
	
	.fifthFlex { display: flex; justify-content: space-between; margin-bottom: 40px; }
	.fifthFlex li { width: 18%; }
	.fifthFlex li div { margin-bottom: 20px; }
	.fifthFlex li .listTtl { margin-bottom: 10px; color: var(--base-color); font-size: 1.1em; }
	
	.listIcon { width: 100px; margin: 0 auto 20px;}
	.subMark { line-height: 1.0; margin-bottom: 5px !important; font-size: 0.8rem; }
	.subMark span.smBg { background: var(--base-color); color: #fff; padding: 1px 10px; line-height: 1.0; }
}
@media screen and (min-width: 768px) and (max-width: 889px)  {	
	#anch-point .ttl01 img { width: 40vw; margin: 0 auto 20px; }
	.in-flex { display: flex; justify-content: space-between; align-items: flex-start; }
	.in-flex .in-flex-Img { width: 46%; }
	.in-flex .in-flex-Txt { width: 50%; }
	
	.in-flex .in-flex-Txt.in-flex-Txt-100 { width: 100%; }
	.in-flex .in-flex-Txt.in-flex-Txt-100 img { width: 60%; margin: 0 20% 20px;}
	
	.fifthFlex { display: flex; justify-content: center; flex-wrap: wrap; }
	.fifthFlex li { width: 27%; margin:0 2% 20px; }
	
	#anch06 .in-flex .in-flex-Txt { width: 100%; } 
	.jsox-zu { width: 80%; margin: 0 auto; }
}
@media screen and (min-width: 900px) and (max-width: 1089px)  {
	#anch-point .ttl01 img { width: 40vw; margin: 0 auto 20px; }
	.in-flex .in-flex-Img { width: 44%; }
	.in-flex .in-flex-Txt { width: 52%; }
	
	.fifthFlex { display: flex; justify-content: center; }
	.fifthFlex li { width: 29%; margin:0 2% 20px; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px)  {
	#anch-point .ttl01 img { width: 40vw; margin: 0 auto 20px; }
	.in-flex .in-flex-Img { width: 42%; }
	.in-flex .in-flex-Txt { width: 54%; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px)  {
}
@media screen and (min-width: 1290px) and (max-width: 1389px)  {
}
@media screen and (min-width: 1390px) and (max-width: 1489px)  {
}

/*-- #anch00 -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
}
@media screen and (min-width: 600px) {
	#anch00 .in-flex-Txt .ttl01 { text-align: left; margin-bottom: 20px; font-size: 2.4em; }
	#anch00 .in-flex-Txt .ttl01 rt { font-size: 0.4em; margin-bottom: 5px; }
}
@media screen and (min-width: 900px) and (max-width: 1089px)  {
	#anch00 .in-flex-Txt .ttl01 { font-size: 2.0em; }
}