@charset "utf-8";
/* ---------------------------------------------------------------------------------------- common */
body{ background: #f4f4f4; }
#kids h2{ padding: 0 0 50px; font-family: yu-gothic-pr6n, sans-serif; font-size: 40px; line-height: 150%;  letter-spacing: 0.1em; text-align: center; font-weight: 800; }
#kids h2 span{ display: block; padding: 0 0 15px; font-size: 16px; letter-spacing: 0.15em; color: #ea609e; }

#kids #bread { border-top: none; }

#fv { background: url(../images/kids/bg_fv.jpg) no-repeat left center / cover; height: 100vh; min-height: 900px;}

#fv .bg { background: #fff; padding-left: 85px; height: 100vh; min-height: 900px; width: 650px; background: url(../images/common/white_bg.gif) repeat-y;  display: flex; align-items: center; flex-wrap: wrap;}

#fv .bg p { display: flex;}

#fv .bg p .aktive_r { font-size: 17px; letter-spacing: 0.2em; color: #000; margin-bottom: 60px; font-weight: 200;}

#fv .bg p .aktive_r::after { content: ""; border-top: solid 1px #000; padding-left: 22px; vertical-align: middle; margin-left: 17px; padding-bottom: 7px; display: inline-block;}

#fv .bg img { padding-left: 20px; margin-top: -7px;}

#fv .bg h1 { font-size: 50px; line-height: 1.6; letter-spacing: 0.1em; margin: -15px 0 0; text-align: inherit; padding: 0;}

#fv .bg h1 .aktive_r { font-size: 17px; color: #000; letter-spacing: 0.1em; margin-top: 50px; font-weight: 200;}



/* ---------------------------------------------------------------------------------------- visual */
#visual { color: #fff; /* max-width: 1600px; */ width: 100%; margin: 0 auto;}

#visual .visual01 { background: url(../images/kids/bg_01.jpg) no-repeat center top; background-size: cover; width: 100%; padding: 119px 0 118px; }

#visual h2{ color: #000; }
#visual h3 { font-size: 30px; margin-bottom: 30px; letter-spacing: 0.08em; line-height: 140%; }
#visual .subttl{ padding: 0 0 70px; color: #000; font-size: 18px; line-height: 200%; letter-spacing: 0.05em; text-align: center; }

#visual .cap { width: 450px; margin: -11px 0;}

#visual .cap p { font-size: 18px; line-height: 2.222; letter-spacing: 0.08em;}
#visual .cap p.smal{ padding: 15px 0 0; font-size: 14px; line-height: 180%; letter-spacing: 0.05em; }
#visual .cap p .astlisk{ position: relative; top: -9px; font-size: 11px; }

#visual .visual02 { background: url(../images/kids/bg_02.jpg) no-repeat; background-size: cover; width: 100%; padding: 134px 0;}

#visual .vis_r { float: right;}

#visual .visual03 { background: url(../images/kids/bg_03.jpg) no-repeat; background-size: cover; width: 100%; padding: 134px 0 138px;}

#visual .visual03 h3 { line-height: 1.333; margin: -5px 0 35px;}

#visual .visual04 { background: url(../images/kids/bg_04.jpg) no-repeat; background-size: cover; width: 100%; padding: 134px 0; color: #000;}

#visual .visual05 { background: url(../images/kids/bg_05.jpg) no-repeat; background-size: cover; width: 100%; padding: 134px 0; color: #000;}



/* ---------------------------------------------------------------------------------------- concept */
#festival #concept h2{ text-align: left; }

#concept{ padding: 0 0 140px; }
#concept p{ font-size: 18px; line-height: 220%; letter-spacing: 0.05em; }

#concept h2{ text-align: left; padding: 50px 0 20px; }
#concept h2 span{ padding: 0 0 35px; }

#concept .flex{ display: flex; align-items: center; }
#concept .flex .left{ width: 600px; }
#concept .flex .right{ width: 445px; height: auto; padding: 100px 0 0; }

#concept .text{ padding: 0 0 70px; }

#concept .figure .left{ float: left; width: 549px; height: auto; }
#concept .figure .right{ float: right; width: 544px; height: auto; }


#concept .cross{ padding: 45px 0; background: #fff url(../images/kids/bg_cross.png) center top/cover no-repeat; box-shadow: 0px 11px 16px -7px rgba(0,0,0,0.2); }
#concept .cross .bg{ width: 1000px; margin: 0 auto; }
#concept .cross .bg02{ background: url(../images/common/bg_flag.png) center top/contain no-repeat; }

#concept .cross .blue{ position: relative; width: 370px; margin: 0 auto; padding: 30px 0 40px; font-size: 20px; letter-spacing: 0.1em; font-weight: 800; text-align: center; background: url(../images/common/icn_flag.png) 40px top/106px no-repeat; color: #343b68; }
#concept .cross .blue .curve{ position: relative; display: block; padding: 5px 0 30px; font-size: 24px; letter-spacing: 0.1em; color: #ea609e; font-weight: 800; }
#concept .cross .blue .curve:before{ position: absolute; content: ""; width: 50px; height: 3px; bottom: 0; left: 50%; transform: translate(-50%,0); background: #ea609e; }

#concept .cross div.cfx{ width: 980px; margin: 0 auto; }
#concept .cross figure{ float: left; width: 123px; margin: 0; }
#concept .cross figcaption{ font-size: 20px; line-height: 23px; font-weight: 800; letter-spacing: 0.1em; color: #343b68; text-align: center; padding-top: 10px; }
#concept .cross figcaption span{ font-size: 12px; font-weight: 800; letter-spacing: 0em; }

#concept .cross .cfx p{ float: right; width: 795px; line-height: 36px; font-size: 15px; }


/* ---------------------------------------------------------------------------------------- merit */
/*

#merit .flex{ flex-wrap: wrap; padding: 20px 0 0; }

#merit .flex .item_box.low{ width: 725px; align-items: flex-start; }
#merit .flex .item_box{ width: 350px; height: 350px; margin: 0 0 25px; padding: 70px 50px 50px; box-sizing: border-box; text-align: center; display: flex; flex-direction: column; align-items: center; }

#merit .flex .item_box:first-of-type{ background: url(../images/kids/merit_01.jpg) center/cover no-repeat; }
#merit .flex .item_box:nth-of-type(2){ background: url(../images/kids/merit_02.jpg) center/cover no-repeat; }
#merit .flex .item_box:nth-of-type(3){ background: url(../images/kids/merit_03.jpg) center/cover no-repeat; }
#merit .flex .item_box:nth-of-type(4){ background: url(../images/kids/merit_04.jpg) center/cover no-repeat; }
#merit .flex .item_box:nth-of-type(5){ background: url(../images/kids/merit_05.jpg) center/cover no-repeat; }
#merit .flex .item_box:nth-of-type(6){ background: url(../images/kids/merit_06.jpg) center/cover no-repeat; }
#merit .flex .item_box:last-of-type{ background: url(../images/kids/merit_07.jpg) center/cover no-repeat; }


#merit .flex .item_box h3{ width: 260px; padding: 0 0 10px; font-size: 40px; letter-spacing: 0.1em; color: #fff; font-weight: 700; }
#merit .flex .item_box h3 span{ display: block; line-height: 40px; letter-spacing: 0.15em; font-family: aktiv-grotesk, sans-serif; font-weight: 300; font-style: normal; font-size: 16px; }
#merit .flex .item_box p{ width: 260px; font-size: 17px; line-height: 180%; letter-spacing: 0.08em; color: #fff; }
*/



/* ---------------------------------------------------------------------------------------- billing */
#flow{ padding: 100px 0; }

#flow .billing_box{ padding: 0 0 80px; background: url(../images/common/icn_down.png) center calc(100% - 25px)/45px no-repeat; }
#flow .billing_box:last-of-type{ padding: 0; background: no-repeat; }

#flow dl{ text-align: center; background: #fff; padding: 17px 0; }
#flow dl dt{ width: 350px; padding: 16px 0; box-sizing: border-box; border-right: 1px solid #898989; font-size: 18px; letter-spacing: 0.1em; }
#flow dl dt span{ display: inline-block; padding: 0 0 20px 30px; color: #ea609e; font-size: 24px; font-weight: 800; }
#flow dl dt img{ width: 83px; height: auto; }

#flow dl dd{ width: 740px; padding: 13px 0 0px 50px; box-sizing: border-box; font-size: 24px; letter-spacing: 0.1em; }
#flow dl dd p{ font-family: yu-gothic-pr6n, sans-serif; font-size: 16px; text-align: left; background: url(../images/kids/icn_check.png) left 5px/22px no-repeat; line-height: 200%; font-weight: 600; }
#flow dl dd p:not(:first-of-type){ margin: 30px 0 0; }
#flow dl dd p span{ display: block; padding: 10px 0 0; font-size: 16px; font-feature-settings: "palt"; }
#flow dl dd p strong{ font-size: 20px; font-weight: 800; }
#flow dl dd p strong.opensons{ font-size: 30px; font-family: open-sans,sans-serif; font-weight: 600; font-style: normal; }



/* ---------------------------------------------------------------------------------------- merit */

#merit{ padding: 100px 0 150px; }
#merit h3{ width: 150px; margin: 50px auto 0; padding: 7px 0; font-size: 24px; border: 1px solid #000; border-radius: 50px; letter-spacing: 0.1em; text-align: center; }

#merit ul{ padding: 30px 0 0; }
#merit ul li{ float: left; width: 365px; height: 250px; text-align: center; border-right: 1px solid #d2d2d2; border-bottom: 1px solid #d2d2d2; }
#merit ul li p{ padding: 150px 30px 30px; font-size: 20px; letter-spacing: 0.01em; line-height: 150%; }
#merit ul li p span{ display: block; padding: 10px 0 0; font-size: 14px; letter-spacing: 0.15em; font-family: aktiv-grotesk, sans-serif; font-weight: 400; font-style: normal;}

#merit ul li:nth-of-type(3n){ border-right: none; }
#merit ul li:nth-of-type(n+4){ border-bottom: none; }

#merit ul li:first-of-type p{ background: url(../images/kids/icn_01.png) center 40px/80px no-repeat; }
#merit ul li:nth-of-type(2) p{ background: url(../images/kids/icn_02.png) center 40px/80px no-repeat; }
#merit ul li:nth-of-type(3) p{ background: url(../images/kids/icn_03.png) center 40px/80px  no-repeat; }
#merit ul li:nth-of-type(4) p{ background: url(../images/kids/icn_04.png) center 40px/80px no-repeat; }
#merit ul li:nth-of-type(5) p{ background: url(../images/kids/icn_05.png) center 40px/80px no-repeat; }
#merit ul li:last-of-type p{ background: url(../images/kids/icn_06.png) center 40px/80px no-repeat; }

#merit .btn_top{ margin: 250px auto 0; }



/* ---------------------------------------------------------------------------------------- products products02 */
#products{ padding-bottom: 150px;}

#products .item01 .item01_bg{ width: calc( 100% - 100px); height: 650px; background: url(../images/kids/img_01.jpg) no-repeat; background-position: left; background-size: cover;}

#products .item01 .w_box{ background: url(../images/kids/icn_07.png) no-repeat #fff; background-size: 150px; background-position: 80px; width: calc( 100% - ( (100% - 1100px) / 2 ) ); margin: -135px 0 80px; padding: 78px 0 92px 320px; z-index: 0; position: relative; box-sizing: border-box; float: right;}

#products .item01 .w_box h3,
#products02 .item01 .w_box h3{ font-size: 30px; line-height: 1.333; letter-spacing: 0.08em;}
#products .item01 .w_box h3 span,
#products02 .item01 .w_box h3 span{ padding: 10px 0 0; display: block; font-size: 14px; line-height: 2.143; letter-spacing: 0.1em; font-weight: 200;}

#products .item01 .w_box p,
#products02 .item01 .w_box p { line-height: 2.25; letter-spacing: 0.08em;}

#products li h4,
#products02 li h4{ padding: 20px 0 0; text-align: center; font-size: 20px; line-height: 130%; letter-spacing: 0.08em; }
#products li h4 span,
#products02 li h4 span{ display: block; padding: 10px 0 0; font-size: 11px; line-height: 140%; letter-spacing: 0.1em; }


/* common */
#products .rateplan,
#products02 .rateplan{ margin: 0 auto; width: 1000px; }

#products .cost,
#products02 .cost{ margin: 0 0 30px; background: #fff; border-radius: 15px; padding: 42px 0 48px; }

#products .cost p,
#products02 .cost p{ text-align: center; }

#products .cost p:nth-of-type(1),
#products02 .cost p:nth-of-type(1){ width: 330px; height: 40px; border: solid 1px #000; border-radius: 20px; font-size: 20px; line-height: 2; margin: 0 auto 37px; font-weight: 800; }

#products .cost p:nth-of-type(2),
#products02 .cost p:nth-of-type(2){ font-size: 18px; margin-bottom: 26px; padding-left: 46px; padding-right: 47px; }

#products .cost p:nth-of-type(2) srtong,
#products02 .cost p:nth-of-type(2) srtong{ font-weight: 800; }

#products .cost p:nth-of-type(3),
#products02 .cost p:nth-of-type(3){ font-size: 14px; }

#products .cost p span,
#products02 .cost p span{ font-size: 40px; color: #ea609e; font-family: open-sans,sans-serif; font-weight: 600; font-style: normal; }

#products .cost p span.black,
#products02 .cost p span.black{ color: #000; }

#products .cost p strong,
#products02 .cost p strong{ font-size: 24px; font-weight: 800; }


/* products */
#products .photo{ flex-wrap: wrap; }

#products .photo li{ text-align: center; }
#products .photo li img{ width: 80%; height: auto; }
#products .photo li:nth-of-type(2) img{ width: 66%; }

#products .photo li:first-of-type,
#products .photo li:nth-of-type(2){ width: 50%; padding: 0 0 20px; }
#products .photo li:nth-of-type(n+3){ width: 33%; }

#products .photo li div{ display: flex; align-items: center; width: 290px; margin: 0 auto; padding: 20px 0 0; }

#products .photo li div .number{ width: 51px; height: 51px; margin: 0 15px 0 0; padding: 15px 0; box-sizing: border-box; font-size: 20px; letter-spacing: 0.1em; border-radius: 50px; border: 1px solid #464646; font-weight: 400; }

#products .photo li div p:last-of-type{ font-size: 20px; letter-spacing: 0.08em; text-align: left; }
#products .photo li div p:last-of-type span{ display: block; padding: 10px 0 0; font-size: 14px; letter-spacing: 0.1em; font-family: aktiv-grotesk, sans-serif; font-weight: 200; font-style: normal; }


#products .w_box02{ box-sizing: border-box; width: 1000px; margin: 50px auto 0; padding: 60px 90px; background: #fff; border-radius: 20px; }
#products .w_box02 h4{ width: 330px; margin: 0 auto; padding: 9px 0; font-size: 20px; letter-spacing: 0.08em; border: 1px solid #464646; border-radius: 50px; text-align: center; font-weight: 800; }

#products .w_box02 ul{ padding: 55px 0 0; flex-wrap: wrap; justify-content: flex-start; border-bottom: 1px solid #aaaaaa; }
#products .w_box02 li{ display: flex; padding: 0 0 40px; align-items: center; }
#products .w_box02 li:nth-of-type(even){ width: 67%; }

#products .w_box02 li .number{ width: 40px; height: 40px; margin: 0 20px 0 0; padding: 11px 0 0; box-sizing: border-box; text-align: center; font-size: 16px; letter-spacing: 0.1em; border-radius: 50px; border: 1px solid #000; font-weight: 400; }

#products .w_box02 li div p:first-of-type{ font-size: 20px; letter-spacing: 0.1em; font-weight: 800;  }
#products .w_box02 li div p:first-of-type span{ font-size: 16px; letter-spacing: 0.05em; font-weight: 300; line-height: 1.769; }
#products .w_box02 li div .detail{ padding: 10px 0 0; font-size: 14px; letter-spacing: 0.05em; }

#products .w_box02 .warrenty{ width: 650px; margin: 0 auto; padding: 50px 0 0; }

#products .w_box02 .warrenty .repair{ width: 166px; padding: 21px 0; box-sizing: border-box; line-height: 140%; letter-spacing: 0.05em; color: #e85f9d; border: 1px solid #e85f9d; border-radius: 10px; text-align: center; font-weight: 800; }
#products .w_box02 .warrenty .repair span{ display: block; padding: 5px 0 0; font-size: 12px; letter-spacing: 0.1em; }

#products .w_box02 .warrenty div p:first-of-type{ font-size: 18px; letter-spacing: 0.05em; }
#products .w_box02 .warrenty div p:first-of-type span{ padding: 0 5px 0 0; color: #ea609e; font-weight: 800; font-size: 24px; }
#products .w_box02 .warrenty div p:first-of-type strong{ font-size: 40px; font-weight: 800; }

#products .w_box02 .warrenty div p:last-of-type{ padding: 20px 0 0; font-size: 14px; letter-spacing: 0.05em; line-height: 200%; }


/* roducts02 */
#products02 .item01 .item01_bg{ float: right; width: calc( 100% - 100px); height: 650px; background: url(../images/kids/img_02.jpg) no-repeat; background-position: left; background-size: cover; }

#products02 .item01 .w_box{ background: #fff; background-size: 150px; background-position: 80px; width: calc( 100% - ( (100% - 1100px) / 2 ) ); margin: -135px 0 80px; padding: 78px 0 92px; z-index: 0; position: relative; box-sizing: border-box; }

#products02 .item01 .w_box .w_text{ background: url(../images/kids/icn_08.png) no-repeat; background-size: 150px; background-position: center left; padding-left: 220px; padding-right: 200px; width: 1100px; box-sizing: border-box; float: right; }

#products02 .photo img{ display: inline-block; padding: 0 30px 30px 0; box-sizing: border-box; }
#products02 .photo img:nth-of-type(3n){ padding: 0 0 30px; }



/* ---------------------------------------------------------------------------------------- additional */
#additional{ padding: 100px 0; background: #fff; }
#additional .small{ width: 1000px; margin: 0 auto; font-size: 14px; letter-spacing: 0.05em; }

#additional table{ width: 1000px; margin: 0 auto 30px; text-align: center; }

#additional thead th{ width: 175px; padding: 17px 0 15px; color: #fff; background: #464646; border: 1px solid #fff; }
#additional thead th:nth-of-type(3){ width: 252px; }
#additional thead th:nth-of-type(4){ width: 400px; }

#additional tbody th{ border: 1px solid #ababab; letter-spacing: 0.01em; line-height: 150%; color: #ea609e; font-weight: 800; }
#additional tbody th span{ display: block; padding: 10px 0 0; font-size: 14px; color: #000; line-height: 180%; letter-spacing: 0.05em; }

#additional tbody td{  border: 1px solid #ababab; }
#additional tbody td:first-of-type{ font-weight: 800; letter-spacing: 0.1em; }
#additional tbody td:first-of-type span{ display: block; padding: 7px 0 0; font-size: 13px; }

#additional tbody td:nth-of-type(2) p:first-of-type{ color: #ea609e; font-weight: 800; letter-spacing: 0.1em; }
#additional tbody td:nth-of-type(2) p:first-of-type span{ font-size: 24px; font-weight: 800; font-family: open-sans,sans-serif; font-weight: 600; font-style: normal; }
#additional tbody td:nth-of-type(2) p:last-of-type{ padding: 7px 0 0;  font-size: 14px; letter-spacing: 0.05em; }

#additional tbody td:nth-of-type(3){ box-sizing: border-box; padding: 30px 30px 30px 40px; }
#additional tbody td:nth-of-type(3) p{ font-size: 14px; line-height: 170%; letter-spacing: 0.05em; text-align: left; }
#additional tbody td:nth-of-type(3) div{ width: 137px; margin: 20px auto; padding: 7px 0 5px; font-size: 14px; border: 1px solid #000; border-radius: 50px; }
#additional tbody td:nth-of-type(3) dt{ float: left; clear: both; width: 140px; padding: 0 0 20px; text-align: left; font-size: 14px; letter-spacing: 0.05em; }
#additional tbody td:nth-of-type(3) dd{ float: left; font-size: 14px; letter-spacing: 0.05em; }
#additional tbody td:nth-of-type(3) dd strong{ font-size: 20px; font-weight: 800; }
#additional tbody td:nth-of-type(3) dd span{ padding: 0 5px 0 0; font-size: 14px; font-weight: 800; }



/* ---------------------------------------------------------------------------------------- variation */
#variation{ padding: 100px 0 0; }

#variation .bg{ background: url(../images/kids/bg_variety.png) center top no-repeat; }
#variation .bg ul{ width: 775px; margin: 0 auto; padding: 50px 0 0; }
#variation .bg ul li{ float: left; width: 250px; text-align: center; }
#variation .bg ul li img{ width: 171px; height: auto; }
#variation .bg ul li p{ width: 210px; margin: 30px auto 0; padding: 10px 0; font-size: 18px; border: 1px solid #000; border-radius: 50px; font-weight: 800; }


#variation .repair{ margin: 30px 0 80px; padding: 40px 0; background: #fff; border-radius: 10px; text-align: center; }
#variation .repair h3{ padding: 8px 0 20px; font-size: 24px; color: #ea609e; letter-spacing: 0.1em; font-weight: 800; }
#variation .repair h3 span{ position: relative; top: -10px; font-size: 14px; }
#variation .repair p{ font-size: 14px; letter-spacing: 0.05em; }


#variation .panel{ padding: 90px 70px 70px; border: 2px solid #f5b3d0; border-radius: 10px; background: repeating-linear-gradient(145deg, #fff 0, #fff 3px, #f5b3d0 4px); }
#variation .panel img{ display: block; float: left; width: 425px; height: auto; }
#variation .panel .right{ float: right; width: 460px; }

#variation .panel h3{ font-size: 30px; letter-spacing: 0.08em; }
#variation .panel h3 span{ display: block; padding: 10px 0 0; font-size:14px; letter-spacing: 0.08em; }
#variation .panel p{ padding: 30px 0; font-size: 18px; line-height: 200%; letter-spacing: 0.08em; }

#variation .panel .w_box{ padding: 25px 0 20px; background: #fff; border-radius: 10px; }
#variation .panel .w_box h4{ width: 190px; margin: 0 auto; padding: 5px 0; letter-spacing: 0.08em; border: 1px solid #000; border-radius: 50px; text-align: center; font-weight: 800; }

#variation .panel .w_box p{ padding: 20px 0 0; font-size:18px; letter-spacing: 0.05em; text-align: center; }
#variation .panel .w_box p span{ font-size: 24px; color: #ea609e; font-weight: 800; }
#variation .panel .w_box p strong{ font-size: 40px; color: #ea609e; font-weight: 800; }


#variation .bnr{ padding: 100px 0 0; }


#kids .btn_top{ margin: 150px auto; }



/* --------------------------------------------------------------------------------------------------------------------------- 
 mobile 
--------------------------------------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 640px) {
/* ---------------------------------------------------------------------------------------- common */

#kids h2{ font-size: 23px; line-height: 150%; padding: 0 0 20px; }
#kids h2 span{ font-size: 13px; padding-bottom: 5px; }

 
#fv { padding: 65px 0 0; background: none; height: auto; min-height: inherit;}
#fv .bg{ min-height: inherit; }

#fv .fv img { width: 100%; height: auto; margin-bottom: 25px; padding-left: 0;}

#fv .fv { background: #fff; padding-left: 0px; width: 100%; background: url(../images/common/white_bg_sp.png) repeat-y;  display: flex; align-items: center; flex-wrap: wrap;}

#fv .fv p { display: flex; align-items: baseline; }

#fv .fv p .aktive_r { font-size: 14px; letter-spacing: 0.2em; color: #000; font-weight: 200;}

#fv .fv p .aktive_r::after { content: ""; border-bottom: solid 1px #000; padding-left: 16px; vertical-align: middle; margin-left: 4px; margin-top: -12px; padding-bottom: 7px; display: inline-block;}

#fv .fv p .aroma_logo { width: 40%; height: auto; margin-left: 5px;}

#fv .fv h1 { font-size: 28px; text-align: left;  line-height: 1.333; letter-spacing: 0.1em; padding: 0; margin: -5px 0 25px;}

#fv .fv h1 .aktive_r { font-size: 13px; color: #000; letter-spacing: 0.1em; line-height: 1.714; margin-top: 20px; font-weight: 200;}


#concept .cross{ padding: 25px 0 35px; }
#concept .cross .bg{ width: 100%; }
#concept .cross .bg02{ background: none; }

#concept .cross .bg02 p{ font-size: 15px; }
#concept .cross .blue{ width: 100%; padding: 27px 0 0; font-size: 14px; background: url(../images/common/icn_flag.png) 60px top/80px no-repeat; }
#concept .cross .blue .curve{ padding: 5px 0 15px; font-size: 16px; }
#concept .cross .blue .curve:before{ width: 30px; height: 2px; }

#concept .cross div.cfx{ background: url(../images/common/bg_flag.png) center 10px/90% no-repeat; width: 100%; }
#concept .cross figure{ float: none; margin: 0 auto; padding: 20px 0 0; width: 100px; }
#concept .cross img{ width: 100%; height: auto; }

#concept .cross figcaption{ font-size: 15px; line-height: 25px; }
#concept .cross figcaption span{ font-size: 12px; }

#concept .cross .cfx p{ float: none; width: 90%; font-size: 12px; padding: 25px 0 0; margin: 0 auto; letter-spacing: 0.1em; line-height: 26px; }


/* ---------------------------------------------------------------------------------------- visual */
#visual { color: #000; max-width: none; width: 100%; margin: 0 auto; }
#visual .subttl{ padding: 0 0 65px; font-size: 14px; text-align: left; }

#visual .visual_sp { background: none; width: 100%; padding: 0; }

#visual .visual_sp img { width: 100%; height: 100%; margin-bottom: 35px;}

#visual h3 { font-size: 24px; margin-bottom: 25px; line-height: 1.4; letter-spacing: 0.08em;}

#visual .cap { width: auto; margin: -5px 0; padding: 0 0 40px; }
#visual .cap p{ padding: 0; font-size: 14px; line-height: 200%; letter-spacing: 0.08em;}
#visual .cap p.smal{ font-size: 12px; }

 

/* ---------------------------------------------------------------------------------------- concept */
#kids #concept h2{ text-align: center; }

#concept{ padding: 0 0 60px; }

#concept .flex{ flex-direction: column; }
#concept .flex .left{ width: 100%;}
#concept .flex .right{ width: 90%; padding: 0; }

#concept p{ padding: 0 0 50px; font-size: 13px; }

#concept .figure{ padding: 0; }
#concept .figure .left{ float: none; padding: 0 0 3px; width: 100%; }
#concept .figure .right{ float: none; width: 100%; }


/* ---------------------------------------------------------------------------------------- voice_slide */
#voice_slide{ padding: 0 0 100px; }

#voice_slide .slider_item_b p{ font-size: 18px; }
#voice_slide .slider_item_b dl{ padding: 30px 0; font-size: 13px; }
#voice_slide .slider_item_b dl dt{ padding: 0 0 10px 0; }

#voice_slide .slider_item_b p:before,
#voice_slide .slider_item_b p:after{ width: 18px; height: 15px; }
#voice_slide .slider_item_b p:before{ left: 0; top: 4px; }
#voice_slide .slider_item_b p:after{ right: 0; bottom: 7px; }



/* ---------------------------------------------------------------------------------------- merit */
/*
#merit .flex{ flex-wrap: nowrap; flex-direction: column; padding: 5px 0 0; }

#merit .flex .item_box{ width: 100%; height: 200px; padding: 35px 20px 25px; }
#merit .flex .item_box.low{ width: 100%; }

#merit .flex .item_box h3{ width: 100%; padding: 0; font-size: 25px; font-weight: 500; }
#merit .flex .item_box h3 span{ font-size: 13px; }
#merit .flex .item_box p{ width: 100%; font-size: 14px; line-height: 180%; }

#merit .flex .item_box:nth-of-type(6){ padding: 20px 25px; }
*/



/* ---------------------------------------------------------------------------------------- billing */
#kids #flow h2{ padding: 0 0 15px; }

#flow{ padding: 60px 0; }

#flow .billing_box{ padding: 0 0 60px; background: url(../images/common/icn_down.png) center calc(100% - 20px)/30px no-repeat; }

#flow dl{ flex-direction: column; padding: 20px 5%; }
#flow dl dt{ position: relative; float: none; width: 100%; padding: 0 0 20px; font-size: 14px; border-right: none; border-bottom: 1px solid #b6b6b6; text-align: left; }
#flow dl dt:before{ display: none; }
#flow dl dt span{ padding: 0 0 0 7%; font-size: 17px;}

#flow dl dt img{ width: 20%; }

#flow dl dd{ width: 100%; padding: 20px 0 0; font-size: 14px; }
#flow dl dd p{ font-size: 13px; background: url(../images/kids/icn_check.png) 0 top/17px no-repeat; padding: 0; box-sizing: border-box; width: 100%; margin: 0; text-align: left; }
#flow dl dd p strong{ font-size: 14px;}
#flow dl dd p strong.opensons{ font-size: 20px; }
#flow dl dd p span{ padding: 8px 0 0; font-size: 13px; }

#flow dl dd p:not(:first-of-type){ margin: 13px auto 0; }



/* ---------------------------------------------------------------------------------------- merit */
#merit{ padding: 25px 0 65px 0; }

#kids #merit h2{ font-size: 24px; line-height: 190%; }
#kids #merit h2 strong{ display: inline-block; padding: 20px 0 0; font-size: 21px; letter-spacing: 0.05em; }

#merit h3{ width: 30%; font-size: 17px; }

#merit ul{ padding: 0; }
#merit ul li{ position: relative; width: 49.5%; height: 150px; border-right: none; }
#merit ul li:nth-of-type(odd):after{ position: absolute; content: ""; width: 1px; height: 85%; top: 15px; right: 0; background: #d2d2d2; }
#merit ul li:nth-of-type(4){ border-bottom: 1px solid #d2d2d2; }

#merit ul li p{ padding: 90px 0 0; font-size: 12px; line-height: 150%; }
#merit ul li p span{ padding: 2px 0 0; font-size: 12px; }

#merit ul li:first-of-type p{ background: url(../images/kids/icn_01.png) center 30px/50px no-repeat; }
#merit ul li:nth-of-type(2) p{ background: url(../images/kids/icn_02.png) center 30px/50px no-repeat; }
#merit ul li:nth-of-type(3) p{ background: url(../images/kids/icn_03.png) center 30px/50px no-repeat; }
#merit ul li:nth-of-type(4) p{ background: url(../images/kids/icn_04.png) center 30px/50px no-repeat; }
#merit ul li:nth-of-type(5) p{ background: url(../images/kids/icn_05.png) center 30px/50px no-repeat; }
#merit ul li:last-of-type p{ background: url(../images/kids/icn_06.png) center 30px/50px no-repeat; }
#merit ul li:last-of-type p a{ line-height: 150%; }

#merit .btn_top{ margin: 60px auto 0; }


/* ---------------------------------------------------------------------------------------- products */
#products,
#products02{ padding-bottom: 65px;}

#products .item01 { }

#products .item01 .item01_bg{ width: calc( 100% - 25px); height: 260px; background: url(../images/kids/img_01-sp.jpg) no-repeat; background-position: left; background-size: cover;}

#products .item01 .w_box{ background: url(../images/kids/icn_07.png) no-repeat #fff; background-size: 120px; background-position: center 50px; width: calc( 100% - 25px ); margin: -39px 0 0; padding: 204.5px 25px 50px; z-index: 0; position: relative; box-sizing: border-box; float: right;}

#products .item01 .w_box h3,
#products02 .item01 .w_box h3{ font-size: 20px; line-height: normal; letter-spacing: 0.08em; text-align: center; margin-bottom: 15px;}

#products .item01 .w_box h3 span,
#products02 .item01 .w_box h3 span{ display: block; font-size: 12px; line-height: normal; letter-spacing: 0.1em; margin-bottom: 25px; font-weight: 200;}

#products .item01 li h4 span,
#products02 .item01 li h4 span{ padding: 5px 0 0; letter-spacing: 0; width: 50vw; margin: 0 0 0 -30px; }

#products .item01 .w_box p,
#products02 .item01 .w_box p{ line-height: inherit; font-size: 13px; letter-spacing: 0.08em; margin: 0; text-align: center; line-height: 150%; }

#products .item01 .rateplan,
#products02 .item01 .rateplan{ display: block; justify-content: inherit; margin: 0 auto; width: 100%;}

#products li h4,
#products02 li h4{ padding: 15px 0 0; font-size: 18px; }

#products li h4 span,
#products02 li h4 span{ padding: 5px 0 0; letter-spacing: 0; }


 /* common */
#products .cost{ margin: 0 0 50px; padding: 0; text-align: center; }
#products .cost:last-of-type{ margin: 0; }
#products .cost p:nth-of-type(1){ border-radius: 50px; padding: 3px 0 1px; width: 50%; height: auto; margin: 0 auto; font-size: 14px; line-height: 1.5; }
#products .cost p.long{ width: 60%; }
#products .cost p:nth-of-type(2){ font-size: 14px; margin-bottom: 18px; padding:0; margin: 20px 0 10px; }
#products .cost p:nth-of-type(3){ font-size: 11px; }
#products .cost p strong{ font-size: 17px; }
#products .cost p span{ font-size: 25px; }

#products .w_box .w_text{ background-size: 120px; background-position: center 50px; margin: 0 0 20px; padding: 205px 0 0; width: 100%; box-sizing: border-box; float: left; }


/* products */
#products .photo{ flex-direction: column; }
#products .photo li{ padding: 0 0 30px; }

#products .photo li:first-of-type{ padding-top: 25px; }
#products .photo li:first-of-type,
#products .photo li:nth-of-type(2),
#products .photo li:nth-of-type(n+3){ width: 100%; }

#products .photo li img{ width: 100%; }
#products .photo li:nth-of-type(2) img{ width: 80%;}

#products .photo li div{ width: 77%; padding: 10px 0 0; }
#products .photo li div .number{ width: 40px; height: 40px; padding: 8px 0; font-size: 15px; color: #1a1b1b; }
#products .photo li div p:last-of-type{ font-size: 15px; }
#products .photo li div p:last-of-type span{ padding: 3px 0 0; font-size: 12px; }

#products .w_box02{ width: 100%; margin: 25px 0 0; padding: 0; }
#products .w_box02 h4{ width: 100%; font-size: 15px; }

#products .w_box02 ul{ padding: 25px 5% 0; }
#products .w_box02 li{ padding: 0 0 20px; }
#products .w_box02 li:first-of-type{ align-items: flex-start; }
#products .w_box02 li:nth-of-type(even){ width: 100%; }
#products .w_box02 li:last-of-type{ padding: 0 0 25px; }

#products .w_box02 li div{ padding: 0 0 0 5%; font-feature-settings: "palt"; }
#products .w_box02 li div p:first-of-type{ font-size: 15px; text-align: left; }
#products .w_box02 li div p:first-of-type span{ font-size: 11px; display: block; }
#products .w_box02 li div .detail{ padding: 0; font-size: 11px; text-align: left; }

#products .w_box02 li .number{ width: 40px; height: 40px; padding: 8px 0; font-size: 15px; }


#products .w_box02 .warrenty{ width: 100%; padding: 25px 0 0; flex-direction: column; }
#products .w_box02 .warrenty .repair{ width: 100%; padding: 20px 0; border-radius: 5px; }
#products .w_box02 .warrenty .repair span{ font-size: 11px; }

#products .w_box02 .warrenty div p:first-of-type{ font-size: 14px; padding: 25px 0 0; }
#products .w_box02 .warrenty div p:first-of-type span{ font-size: 17px; }
#products .w_box02 .warrenty div p:first-of-type strong{ font-size: 25px; }

#products .w_box02 .warrenty div p:last-of-type{ padding: 25px 0 0; font-size: 11px; text-align: left; }


/* products02 */
#products02 .item01 .item01_bg{ width: calc( 100% - 25px); height: 260px; background-position: left; background: url(../images/kids/img_02-sp.jpg) no-repeat; background-size: cover; }

#products02 .item01 .w_box{ background-size: 120px; background-position: center 50px; width: calc( 100% - 25px ); margin: -39px 0 0; padding: 0 25px 50px; z-index: 0; position: relative; box-sizing: border-box; }
#products02 .item01 .w_box .w_text{ padding: 205px 0 0; background-size: 120px; background-position: center 50px; padding-left: 0; width: 100%; float: none; }

#products02 .item01 .w_box p{ padding: 0 0 30px; }

#products02 .photo img,
#products02 .photo img:nth-of-type(3n){ padding: 0 4% 4% 0; width: 48%; height: auto; }
#products02 .photo img:nth-of-type(even){ padding: 0 0 4% 0; }



/* ---------------------------------------------------------------------------------------- additional */
#additional{ padding: 60px 0; }
#additional .small{ width: 100%; font-size: 11px; }

#additional table{ width: 100%; margin: 0 auto 50px; }
#additional table{ margin: 0 auto 20px; }

#additional tbody th{ padding: 15px 0; font-size: 15px; letter-spacing: 0.1em; color: #fff; background: #464646; font-weight: 500; text-align: center; }
#additional tbody th span{ display: inline; color: #fff; font-size: 11px; padding: 0 0 0 5px; }
#additional tbody tr td{ padding: 20px 6%; }

#additional tbody tr{ text-align: left; }
#additional tbody tr dt{ padding: 0 0 10px 0; font-size: 13px; letter-spacing: 0.1em; font-weight: 800; }
#additional tbody tr dd{ font-size: 13px; line-height: 160%; }

#additional tbody tr:nth-of-type(2) dd{ letter-spacing: 0.1em; }

#additional tbody tr:nth-of-type(3) dd{ font-size: 17px; color: #ea609e; font-weight: 800; letter-spacing: 0.05em; }
#additional tbody tr:nth-of-type(3) dd span{ color: #000; font-weight: 500; display: initial; padding: 0 0 0 5px; }
#additional tbody tr:nth-of-type(3) dd strong{ padding: 0 0 0 5px; font-size: 25px; font-family: open-sans,sans-serif; font-weight: 600; font-style: normal; }

#additional tbody tr:nth-of-type(4) dd.small{ font-size: 11px; padding: 5px 0 0; }
#additional tbody tr:nth-of-type(4) div{ font-size: 13px; letter-spacing: 0.05em; width: 40%; margin: 25px auto 15px; padding: 5px 0; text-align: center; border: 1px solid #000; border-radius: 50px; }
#additional tbody tr:nth-of-type(4) dl.cfx dt{ float: left; clear: both; width: 40%; padding: 5px 0 0; font-size: 13px; letter-spacing: 0.05em; font-weight: 500; font-feature-settings: "palt"; }
#additional tbody tr:nth-of-type(4) dl.cfx dd{ float: left; width: 60%; padding: 0 0 10px 0; font-size: 13px; letter-spacing: 0.05em; }
#additional tbody tr:nth-of-type(4) dl.cfx dd strong{ font-size: 17px; font-weight: 800; }
#additional tbody tr:nth-of-type(4) dl.cfx dd span{ font-size: 13px; font-weight: 800; display: inline; padding: 0 5px 0 0; }



/* ---------------------------------------------------------------------------------------- variation */
#variation{ padding: 0; }
#variation .bg{ width: 85%; margin: 0 auto; background: url(../images/kids/bg_variety-sp.png) center top/100% no-repeat; }

#variation .bg ul{ width: 100%; padding: 25px 0 0; }
#variation .bg ul li{ width: 30%; height: auto; }
#variation .bg ul li:not(:last-of-type){ padding: 0 4% 0 0; }
#variation .bg ul li img{ width: 70%; height: auto; margin: 0 auto; }

#variation .bg ul li p{ width: 100%; margin: 15px auto 0; font-size: 13px; border-radius: 7px; line-height: 150%; }
#variation .repair{ margin: 25px 0 50px; padding: 20px 7%; border-radius: 5px; }
#variation .repair p{ font-size: 11px; letter-spacing: 0.08em; text-align: left; line-height: 160%; }
#variation .repair h3{ font-size: 17px; }
#variation .repair h3 span{ font-size: 10px; }


#variation .panel{ padding: 50px 7%; }

#variation .panel h3{ font-size: 20px; text-align: center; padding: 0 0 30px 0; }
#variation .panel h3 span{ padding: 15px 0 0; font-size: 12px; }

#variation .panel img{ float: none; width: 100%; }
#variation .panel p{ padding: 25px 0; font-size: 13px; }
#visual .cap p .astlisk{ top: -7px; font-size: 10px; }

#variation .panel .w_box h4{ width: 75%; padding: 6px 0 5px; font-size: 15px; }
#variation .panel .w_box p{ padding: 10px 0 0; font-size: 14px; }
#variation .panel .w_box p span{ font-size: 17px; }
#variation .panel .w_box p strong{ font-size: 25px; }

#variation .bnr{ padding: 10px 0 0; }
#variation .bnr img{ width: 100%; height: auto; }


#kids .btn_top{ margin: 60px auto 70px; }


}



