@charset "utf-8";
/*-------------------------------------------------
	txt
--------------------------------------------------*/
.txt_ll { font-size: 3.75vw; letter-spacing: 7.5px; line-height: 1.2; font-weight: Light;font-family: "irohamaru";}
.txt_ss { font-size: 0.87vw; letter-spacing: 12px; line-height: 1; font-family: "irohamaru_m";}
.txt_mm { font-size: 1.5vw; letter-spacing: 3px; line-height: 1;  font-weight: Light;font-family: "irohamaru";}
#main .top_btn .txt_l { font-size: 1.87vw; letter-spacing: 1.5; line-height: 1;}
@media screen and (max-width: 1400px) {
.txt_ss { font-size: 1vw; }
.txt_mm { font-size: 1.8vw; }
}/*END*/
@media screen and (max-width: 1024px) {
.txt_ll { font-size: 5.5vw; }
.txt_ss { font-size: 1.5vw; }
.txt_mm { font-size: 2.4vw; }
#main .top_btn .txt_l { font-size: 2.9vw; letter-spacing: 1.5; line-height: 1;}
}/*END*/
@media screen and (max-width: 700px) {
.txt_ll { font-size: 5.5vw; }
.txt_ss { font-size: 1.8vw; }
.txt_mm { font-size: 3vw; }
#main .top_btn .txt_l { font-size: 2.9vw; letter-spacing: 1.5; line-height: 1;}
}/*END*/
@media screen and (max-width: 640px) {
.txt_ll { font-size: 7vw; letter-spacing: 6px;}
.txt_ss { font-size: 2vw; letter-spacing: 10px;}
.txt_mm { font-size: 4vw; }
#main .top_btn .txt_l { font-size: 3.5vw; letter-spacing: 1.5; line-height: 1;}
}/*END*/
@media screen and (max-width: 460px) {
.txt_ll { font-size: 6.8vw;  letter-spacing: 5px;}
.txt_ss { font-size: 2.4vw; letter-spacing: 10px;}
.txt_mm { font-size: 4.5vw; }
#main .top_btn .txt_l { font-size: 4.8vw; letter-spacing: 1.5; line-height: 1;}
}/*END*/
@media screen and (max-width: 400px) {
.txt_ll { font-size: 8vw;  letter-spacing: 5px;}
.txt_ss { font-size: 2.7vw; letter-spacing: 10px;}
.txt_mm { font-size: 4.5vw; }
#main .top_btn .txt_l { font-size: 4.8vw; letter-spacing: 1.5; line-height: 1;}
}/*END*/
/*-------------------------------------------------
	main
--------------------------------------------------*/
#main { width: 100%; height: 47vw;  z-index: 2; padding-top: 100px; position: relative;}
#main .catchphrase{ width: 660px;height: 405px;text-align: center;position: absolute;background: rgba(255,255,255,1); border-radius: 60px;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
#main .catchphrase .catch_inner{ width: 100%; position: relative;}
#main .catchphrase .clk_en{ padding-top: 47px;}
#main .catchphrase h1{ padding-top: 31px;}
#main .catchphrase .hukidasi{ padding-top: 32px; width: 367px; margin: 0 auto;}
#main .top_btn { margin: 23px auto 0;width: 464px; height: 55px; background: #56cad0; text-align: center; border-radius: 50px;position: relative; }
#main .top_btn:hover { opacity: 0.7;}
#main .top_btn a{ width: 80%;color: #fff; position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
/* モーダル */
.scroll6{width: 100%;height: auto; position: absolute;}
.scroll6 img {vertical-align: bottom;width: 100%;}
.scroll6 li {width: 100%;}
.catchphrase .txt_l { font-family: "irohamaru";}
#main .catchphrase{ width: 41.2vw;height: 25.3vw;}
#main .catchphrase .clk_en{ padding-top: 2.9vw;}
#main .catchphrase h1{ padding-top: 1.9vw;}
#main .catchphrase .hukidasi{ padding-top: 2vw;width: 100%;}
#main .catchphrase .hukidasi img{ width: 22.9vw;}
#main .top_btn { width: 28.9vw; height: 3.4vw; margin: 1.43vw auto 0;}
@media screen and (max-width: 1600px) {
#main .catchphrase{ border-radius: 3.75vw;}
}/*END*/
@media screen and (max-width: 1300px) {
#main .catchphrase{ border-radius: 3.75vw;}
#main .catchphrase .hukidasi{ padding-top: 1.8vw;}
#main .catchphrase .hukidasi img{ width: 25vw;}
}/*END*/
@media screen and (max-width: 1024px) {
#main {padding-top: 80px; height: 72vw;}
#main .catchphrase{ width: 60vw;height: 35vw;}
#main .catchphrase .clk_en{ padding-top: 4vw;}
#main .catchphrase h1{ padding-top: 2.9vw;}
#main .catchphrase .hukidasi{ padding-top: 1.8vw;}
#main .catchphrase .hukidasi img{ width: 35vw;}
#main .top_btn { width: 38vw; height: 4.5vw; margin: 2vw auto 0;}
.scroll6 li {width: 150%;}
}/*END*/
@media screen and (max-width: 700px) {
#main .catchphrase{ width: 65vw;height: 38vw;}
#main .catchphrase .clk_en{ padding-top: 6vw;}
#main .catchphrase h1{ padding-top: 2.9vw;}
#main .catchphrase .hukidasi{ padding-top: 1.8vw;}
#main .catchphrase .hukidasi img{ width: 37vw;}
#main .top_btn { width: 45vw; height: 6vw; margin: 2vw auto 0;}
}/*END*/
@media screen and (max-width: 640px) {
#main { height: 127vw;}
#main .catchphrase{ width: 80vw;height: 51.5vw;}
#main .catchphrase .clk_en{ padding-top: 6vw;}
#main .catchphrase h1{ padding-top: 3vw;}
#main .catchphrase .hukidasi{ padding-top: 3vw;}
#main .catchphrase .hukidasi img{ width: 50vw;}
#main .top_btn { margin: 4vw auto 0;width: 56vw; height: 8vw;}
.scroll6 li {width: 250%;}
}/*END*/
@media screen and (max-width: 400px) {
#main .catchphrase{ width: 90vw;height: 58vw;}
#main .catchphrase .clk_en{ padding-top: 6vw;}
#main .catchphrase h1{ padding-top: 3.5vw;}
#main .catchphrase .hukidasi{ padding-top: 4vw;}
#main .catchphrase .hukidasi img{ width: 60vw;}
#main .top_btn { margin: 4vw auto 0;width: 62vw; height: 8vw;}
}/*END*/
/*-------------------------------------------------
	explanation
--------------------------------------------------*/
#explanation { margin: 100px auto; position: relative; max-width: 1600px;}
#explanation .exp_wrap{ max-width: 1250px; width: 100%; margin: 0 auto; text-align: center;}
/* txt */
#explanation .exp_wrap h2{ font-weight: 700;}
#explanation .exp_wrap h3{ font-weight: 600; padding-top: 80px; line-height: 2.2;letter-spacing: 2px; font-size: 21px;}
/* 約束 */
#explanation .exp_wrap .promise ul{ margin-top: 80px; display: flex; align-items: center; justify-content: center;}
#explanation .exp_wrap .promise ul li{ width: 250px;height: 250px; border-radius: 50%; color: #fff;}
/* 約束(円） */
#explanation .exp_wrap .promise ul li.blue{  margin-right: 17px;background: #004ea2;}
#explanation .exp_wrap .promise ul li.l_blue{  margin-right: 17px;background: #81cde3;}
#explanation .exp_wrap .promise ul li.purple{  margin-right: 17px;background: #a5a4d1;}
#explanation .exp_wrap .promise ul li.green{ background: #c9d800;}
/* 約束(txt） */
#explanation .exp_wrap .promise ul li.blue p{ margin-top: 50px;margin-bottom: 30px;}
#explanation .exp_wrap .promise ul li.purple p{ margin-top: 40px;margin-bottom: 15px;}
#explanation .exp_wrap .promise ul li.l_blue p{ margin-top: 40px;margin-bottom: 20px;}
#explanation .exp_wrap .promise ul li.green p{ margin-top: 40px;margin-bottom: 20px;}
#explanation .exp_wrap .promise ul li p.txt_m{ line-height: 1.3; font-size: 16px;}
/* 約束(アイコン） */
#explanation .exp_wrap .promise ul li.blue img,
#explanation .exp_wrap .promise ul li.purple img,
#explanation .exp_wrap .promise ul li.green img{ height: 100px;}
#explanation .exp_wrap .promise ul li.l_blue img{ height: 96px;}
#explanation .exp_wrap h2 .br_sp{ display: none;}
#explanation .exp_wrap h2 .br_sp{ display: block;}
@media screen and (max-width: 1400px) {
#explanation .exp_wrap{ width: 80%;}
#explanation .exp_wrap .promise ul li{ width: 19vw;height: 19vw;}
/* txt */
#explanation .exp_wrap h2{ font-weight: 700; }
/* 約束(円） */
#explanation .exp_wrap .promise ul li.blue,
#explanation .exp_wrap .promise ul li.purple,
#explanation .exp_wrap .promise ul li.l_blue{ margin-right: 1.2vw}
/* 約束(txt） */
#explanation .exp_wrap .promise ul li.blue p{ margin-top: 4.2vw;margin-bottom: 2.5vw;}
#explanation .exp_wrap .promise ul li.purple p{ margin-top: 3.5vw;margin-bottom: 1.4vw;}
#explanation .exp_wrap .promise ul li.l_blue p{ margin-top: 3.5vw;margin-bottom: 1.5vw;}
#explanation .exp_wrap .promise ul li.green p{ margin-top: 3.5vw;margin-bottom: 1.7vw;}
#explanation .exp_wrap .promise ul li p.txt_m{ line-height: 1.3;}
#explanation .exp_wrap .promise ul li.txt_m { font-size: 1.14vw;letter-spacing: 1.7px; line-height: 1.6; font-weight: 500;}
/* 約束(アイコン） */
#explanation .exp_wrap .promise ul li.blue img,
#explanation .exp_wrap .promise ul li.purple img,
#explanation .exp_wrap .promise ul li.green img{ height: 7vw;}
#explanation .exp_wrap .promise ul li.l_blue img{ height: 6.9vw;}
}/*END*/
@media screen and (max-width: 1024px) {
#explanation { margin: 80px auto 100px;}
#explanation .exp_wrap h3{ padding-top: 60px; font-size: 21px;}
#explanation .exp_wrap p{ text-align: left;}
/* 約束 */
#explanation .exp_wrap .promise ul { flex-wrap: wrap; margin-top: 50px;max-width: 800px;}
#explanation .exp_wrap .promise ul li{ width: 250px;height: 250px; margin-top: 30px;text-align: center;}
#explanation .exp_wrap .promise ul li p{ text-align: center;}
/* 約束(円） */
#explanation .exp_wrap .promise ul li.blue{  margin-right: 30px;margin-top: 30px;}
#explanation .exp_wrap .promise ul li.l_blue{  margin-right: 0px;margin-top: 30px;}
#explanation .exp_wrap .promise ul li.purple{  margin-right: 30px;margin-top: 30px;}
#explanation .exp_wrap .promise ul li.green{ margin-top: 30px;}
/* 約束(txt） */
#explanation .exp_wrap .promise ul li.blue p{ margin-top: 50px;margin-bottom: 30px;}
#explanation .exp_wrap .promise ul li.l_blue p{ margin-top: 40px;margin-bottom: 15px;}
#explanation .exp_wrap .promise ul li.purple p{ margin-top: 40px;margin-bottom: 25px;}
#explanation .exp_wrap .promise ul li.green p{ margin-top: 40px;margin-bottom: 20px;}
/* 約束(アイコン） */
#explanation .exp_wrap .promise ul li.blue img,
#explanation .exp_wrap .promise ul li.purple img,
#explanation .exp_wrap .promise ul li.green img{ height: 100px;}
#explanation .exp_wrap .promise ul li.l_blue img{ height: 96px;}
}/*END*/
@media screen and (max-width: 670px) {
#explanation .exp_wrap h3{ padding-top: 70px; font-size: 21px;}
#explanation .exp_wrap .promise ul { margin-top: 20px;}
#explanation .exp_wrap .promise ul li{ width: 37.3vw;height: 37.3vw;}
/* 約束(円） */
#explanation .exp_wrap .promise ul li.blue{  margin-right: 4.4vw;margin-top: 4.4vw;}
#explanation .exp_wrap .promise ul li.l_blue{  margin-right: 0px;margin-top: 4.4vw;}
#explanation .exp_wrap .promise ul li.purple{  margin-right: 4.4vw;margin-top: 4.4vw;}
#explanation .exp_wrap .promise ul li.green{ margin-top: 4.4vw;}
/* 約束(txt） */
#explanation .exp_wrap .promise ul li.blue p{ margin-top: 7.4vw;margin-bottom: 4.4vw;}
#explanation .exp_wrap .promise ul li.l_blue p{ margin-top: 5.9vw;margin-bottom: 2.2vw;}
#explanation .exp_wrap .promise ul li.purple p{ margin-top: 5.9vw;margin-bottom: 3.7vw;}
#explanation .exp_wrap .promise ul li.green p{ margin-top: 5.9vw;margin-bottom: 2.9vw;}
/* 約束(アイコン） */
#explanation .exp_wrap .promise ul li.blue img,
#explanation .exp_wrap .promise ul li.purple img,
#explanation .exp_wrap .promise ul li.green img{ height: 14.9vw;}
#explanation .exp_wrap .promise ul li.l_blue img{ height: 14.3vw;}
}/*END*/
@media screen and (max-width: 660px) {
#explanation { margin: 30px auto 90px;}
#explanation .exp_wrap h3{ padding-top: 50px; font-size: 19px;}
.himitu_span { display: inline-block;}
}/*END*/
@media screen and (max-width: 500px) {
/* txt */
#explanation .exp_wrap h2{ line-height: 1.5;}
#explanation .exp_wrap .promise ul li p.txt_m{ font-size: 3vw;}
.span_sp { display: block;}
}/*END*/
@media screen and (max-width: 460px) {
#explanation { margin: 30px auto 60px;}
#explanation .exp_wrap .promise ul li p.txt_m{ line-height: .8;}
#explanation .exp_wrap .promise ul li p.txt_m rt { line-height: .2;}
#explanation .exp_wrap h2 .br_sp{ display: block;}
/* 約束(txt） */
#explanation .exp_wrap .promise ul li.blue p{ margin-top: 7.4vw;margin-bottom: 3.8vw;}
#explanation .exp_wrap .promise ul li.l_blue p{ margin-top: 5.9vw;margin-bottom: 2.6vw;}
#explanation .exp_wrap .promise ul li.purple p{ margin-top: 5.9vw;margin-bottom: 2.9vw;}
#explanation .exp_wrap .promise ul li.green p{ margin-top: 5.9vw;margin-bottom: 2.9vw;}
/* 約束(アイコン） */
#explanation .exp_wrap .promise ul li.blue img,
#explanation .exp_wrap .promise ul li.purple img,
#explanation .exp_wrap .promise ul li.green img{ height: 13vw;}
#explanation .exp_wrap .promise ul li.l_blue img{ height: 13vw;}
}/*END*/

/*-------------------------------------------------
	bg_img
--------------------------------------------------*/
.bg_img01{ position: absolute; top: 0%; left: 3%; width: 221px;}
.bg_img02{ position: absolute; top: 60%; right: 3%; width: 120px;}
@media screen and (max-width: 1600px) {
.bg_img01{ width: 13.8vw;}
.bg_img02{ width: 8.3vw;right: 2.6%;}
}/*END*/

@media screen and (max-width: 1024px) {
.bg_img01{ display: none;}
.bg_img02{ display: none;}
}/*END*/
@media screen and (max-width: 900px) {

}/*END*/