@charset "UTF-8";
body{ background: url(../images/concept/html-bg01.png) repeat center top; background-size:100px; }

@media screen and (min-width: 768px),print {

main{ width:100%!important; font-family: "Zen Kaku Gothic New", sans-serif; font-style: normal; }

#con01{ width:100%; max-width:1920px; margin:-24px auto 0; padding-top: 102px; padding-bottom: 127px; background: url(../images/concept/con01-bg01.png) no-repeat center top; }
#con01 .inner-Box{ width:1100px; margin:0 auto; }
#con01 .ttl{ margin-bottom:523px; }
#con01 .txt-box{ width:510px; margin-left:auto; }
#con01 .txt-box .txt{ font-size:16px; line-height:33px; letter-spacing:0.8px; }
#con01 .txt-box .mb1{ margin-bottom: 33px; }

#con02{ width:100%; max-width:1920px; margin:0 auto; padding: 81px 0 0px; background-color:#F7F5F1; }
#con02 .ttl{ text-align:center; margin-bottom:120px; }

#con02 .box1{ background-color:#F7F5F1; padding-bottom:137px; }
#con02 .box1 .inbox1{ width:1280px; margin:0 auto 86px; position:relative; padding-top:144px; }
#con02 .box1 .inbox1 .num{ position:absolute; top:-45px; left:55px; z-index:2 }
#con02 .box1 .inbox1 .pic1{ position:absolute; top:0; right:0; }
#con02 .box1 .inbox1 .ttl1{font-size:32px;line-height:76px;letter-spacing:3.2px;margin-left:70px;z-index:3;position:relative;margin-bottom:45px;font-weight: 500;}
#con02 .box1 .inbox1 .ttl1 span{ display: inline-block; background-color:#fff; margin-bottom:5px; padding:0 20px 0; }
#con02 .box1 .inbox1 .ttl2{ font-size:22px; font-weight:700; line-height:33px; letter-spacing:1.1px; margin-bottom:25px; }
#con02 .box1 .inbox1 .txt-box1{ margin-left:90px; font-size:16px; line-height:33px; letter-spacing:0.8px; width:450px; }
#con02 .box1 .inbox1 .txt-box1 .mb1{ margin-bottom:21px; }
#con02 .box1 .inbox2{ width:1280px; margin:0 auto 0px; position:relative; }
#con02 .box1 .inbox2 .pic1{ position:absolute; top:-11px; left:0; }
#con02 .box1 .inbox2 .txt-box2{ width:521px; margin-left:auto; margin-right: 90px; font-size:16px; line-height:33px; letter-spacing:0.8px; }
#con02 .box1 .inbox2 .txt-box2 .mb1{ margin-bottom:24px; }

#con02 .box2{ background-color:#FFFFFF; padding: 190px 0 130px; }
#con02 .box2 .inbox1{ width:1280px; margin:0 auto 81px; position:relative; padding-top:145px; }
#con02 .box2 .inbox1 .num{ position:absolute; top:-45px; right:47px; z-index:2 }
#con02 .box2 .inbox1 .pic1{ position:absolute; top:0; left:0; }
#con02 .box2 .inbox1 .ttl1{ font-size:32px; line-height:76px; letter-spacing:3.2px; z-index:3; position:relative; margin-bottom:45px; text-align: right; margin-right:70px; }
#con02 .box2 .inbox1 .ttl1 span{display: inline-block;background-color:#F7F5F1;margin-bottom:5px;padding:0 20px 0;font-weight: 500;}
#con02 .box2 .inbox1 .ttl2{ font-size:22px; font-weight:700; line-height:33px; letter-spacing:1.1px; margin-bottom:25px; }
#con02 .box2 .inbox1 .txt-box1{ margin-left: auto; margin-right:90px; font-size:16px; line-height:33px; letter-spacing:0.8px; width:450px; }
#con02 .box2 .inbox1 .txt-box1 .mb1{ margin-bottom:21px; }
#con02 .box2 .inbox2{ width:1280px; margin:0 auto 0px; position:relative; }
#con02 .box2 .inbox2 .pic1{  }

#con02 .box3{ background-color:#F7F5F1; padding: 190px 0 130px; }
#con02 .box3 .inbox1{ width:1280px; margin:0 auto 125px; position:relative; padding-top:146px; }
#con02 .box3 .inbox1 .num{ position:absolute; top:-45px; left:55px; z-index:2 }
#con02 .box3 .inbox1 .pic1{ position:absolute; top:0; right:0; }
#con02 .box3 .inbox1 .ttl1{ font-size:32px; line-height:76px; letter-spacing:3.2px; margin-left:70px; z-index:3; position:relative; margin-bottom:45px; }
#con02 .box3 .inbox1 .ttl1 span{display: inline-block;background-color:#fff;margin-bottom:5px;padding:0 20px 0;font-weight: 500;}
#con02 .box3 .inbox1 .ttl2{font-size:22px;font-weight:700;line-height:33px;letter-spacing:1.1px;margin-bottom:22px;position: relative;width: 500px;}
#con02 .box3 .inbox1 .txt-box1{ margin-left:90px; font-size:16px; line-height:33px; letter-spacing:0.8px; width:450px; }
#con02 .box3 .inbox1 .txt-box1 .mb1{ margin-bottom:24px; }
#con02 .box3 .inbox2{ width:1100px; min-height: 293px; margin:0 auto 0px; position:relative; }
#con02 .box3 .inbox2 .pic1{ position:absolute; top:0; left:0; }
#con02 .box3 .inbox2 .icon{ position:absolute; top:0; right:46px; }

#con02 .box4{ background-color:#FFFFFF; padding: 190px 0 70px; }
#con02 .box4 .inbox1{ width:1280px; margin:0 auto 72px; position:relative; padding-top:145px; }
#con02 .box4 .inbox1 .num{ position:absolute; top:-45px; right:0px; z-index:2 }
#con02 .box4 .inbox1 .pic1{ position:absolute; top:0; left:0; }
#con02 .box4 .inbox1 .ttl1{ font-size:32px; line-height:76px; letter-spacing:3.2px; z-index:3; position:relative; margin-bottom:45px; text-align: right; margin-right:121px; }
#con02 .box4 .inbox1 .ttl1 span{display: inline-block;background-color:#F7F5F1;margin-bottom:5px;padding:0 20px 0;font-weight: 500;}
#con02 .box4 .inbox1 .ttl2{ font-size:22px; font-weight:700; line-height:33px; letter-spacing:1.1px; margin-bottom:26px; }
#con02 .box4 .inbox1 .txt-box1{ margin-left: auto; margin-right:90px; font-size:16px; line-height:33px; letter-spacing:0.8px; width:450px; }
#con02 .box4 .inbox1 .txt-box1 .mb1{ margin-bottom:21px; }
#con02 .box4 .inbox2{ margin:0 auto 0px; position:relative; }
#con02 .box4 .inbox2 .pic1{ position: relative; overflow: hidden; height: 455px; }
#con02 .box4 .inbox2 .pic1 img{ position: absolute; top: 50%; left: 50%; width: 1920px; height: 455px; transform: translate(-50%, -50%); }

#con03{ width: 100%; max-width:1920px; margin:0 auto; padding: 130px 0 66px; }
#con03 .ttl{ position: relative; overflow: hidden; height: 734px; margin-bottom:70px; }
#con03 .ttl img{ position: absolute; top: 50%; left: 50%; width: 1920px; height: 734px; transform: translate(-50%, -50%); }
#con03 .box1{ width: 1100px; min-height: 287px; margin:0 auto 86px; position:relative; padding:63px 0 0; }
#con03 .box1 .pic{ position:absolute; top:0; left:0; }
#con03 .box1 .txt-box{ width:510px; margin-left:auto; font-size:16px; line-height:33px; letter-spacing:0.8px; }
#con03 .box1 .txt-box .mb1{ margin-bottom:30px; }
#con03 .txt2{text-align:center;font-size: 22px;line-height:52px;letter-spacing:2.1px;font-weight: 500;}

}

@media screen and (max-width: 767px) {

main{ font-family: "Zen Kaku Gothic New", sans-serif; font-style: normal; }

#con01{ margin-top: 6vw; padding-top: 24vw; padding-bottom: 91vw; background: url(../images/concept/sp-con01-bg01.png) no-repeat center top; background-size: 100%; }
#con01 .inner-Box{ margin:0 auto; }
#con01 .ttl{ margin: 0 7vw 110vw; }
#con01 .txt-box{ margin: 0 10vw; }
#con01 .txt-box .txt{ font-size:3.86vw; line-height: 2; letter-spacing: 0.24vw; }
#con01 .txt-box .mb1{ margin-bottom: 7.24vw; }

#con02{ padding: 15vw 0 0vw; background-color:#F7F5F1; }
#con02 .ttl{ text-align:center; margin: 0 15vw 25vw; }

#con02 .box1{ background-color:#F7F5F1; padding-bottom:12vw; }
#con02 .box1 .inbox1{ margin:0 4vw 12vw; position:relative; }
#con02 .box1 .inbox1 .num{ position:absolute; top:-8.86vw; left:3.28vw; right: 14vw; z-index:2 }
#con02 .box1 .inbox1 .pic1{ margin-bottom:-1vw; }
#con02 .box1 .inbox1 .ttl1{font-size:5.2vw;line-height: 1.6;letter-spacing: 0.24vw;z-index:3;position:relative;margin-bottom:6vw;font-weight: 500;}
#con02 .box1 .inbox1 .ttl1 span{ display: inline-block; background-color:#fff; margin-bottom:2vw; padding:0 4.83vw 0; }
#con02 .box1 .inbox1 .ttl2{ font-size:4.8vw; font-weight:700; line-height: 1.6; letter-spacing: 0.24vw; margin: 0 0vw 7.24vw; }
#con02 .box1 .inbox1 .txt-box1{ margin: 0 5vw; font-size:3.86vw; line-height: 2; letter-spacing: 0.24vw; }
#con02 .box1 .inbox1 .txt-box1 .mb1{ margin-bottom:5.79vw; }
#con02 .box1 .inbox2{ margin:0 4vw 0vw; position:relative; }
#con02 .box1 .inbox2 .pic1{ margin-bottom:8vw; }
#con02 .box1 .inbox2 .txt-box2{ margin: 0 5vw; font-size:3.86vw; line-height: 2; letter-spacing: 0.24vw; }
#con02 .box1 .inbox2 .txt-box2 .mb1{ margin-bottom:5.79vw; }

#con02 .box2{ background-color:#fff; padding: 25vw 0 12vw; }
#con02 .box2 .inbox1{ margin:0 4vw 12vw; position:relative; }
#con02 .box2 .inbox1 .num{ position:absolute; top:-8.86vw; left:3.28vw; right: 14vw; z-index:2 }
#con02 .box2 .inbox1 .pic1{ margin-bottom:-1vw; }
#con02 .box2 .inbox1 .ttl1{font-size:5.2vw;line-height: 1.6;letter-spacing: 0.24vw;z-index:3;position:relative;margin-bottom:6vw;font-weight: 500;}
#con02 .box2 .inbox1 .ttl1 span{ display: inline-block; background-color:#F7F5F1; margin-bottom:2vw; padding:0 4.83vw 0; }
#con02 .box2 .inbox1 .ttl2{ font-size:4.8vw; font-weight:700; line-height: 1.6; letter-spacing: 0.24vw; margin: 0 0vw 7.24vw; }
#con02 .box2 .inbox1 .txt-box1{ margin: 0 5vw; font-size:3.86vw; line-height: 2; letter-spacing: 0.24vw; }
#con02 .box2 .inbox1 .txt-box1 .mb1{ margin-bottom:5.79vw; }
#con02 .box2 .inbox2{ margin:0 4vw 0vw; position:relative; }
#con02 .box2 .inbox2 .pic1{ margin-bottom:8vw; }
#con02 .box2 .inbox2 .txt-box2{ margin: 0 5vw; font-size:3.86vw; line-height: 2; letter-spacing: 0.24vw; }
#con02 .box2 .inbox2 .txt-box2 .mb1{ margin-bottom:5.79vw; }

#con02 .box3{ background-color:#F7F5F1; padding: 25vw 0 12vw; }
#con02 .box3 .inbox1{ margin:0 4vw 12vw; position:relative; }
#con02 .box3 .inbox1 .num{ position:absolute; top:-8.86vw; left:3.28vw; right: 14vw; z-index:2 }
#con02 .box3 .inbox1 .pic1{ margin-bottom:-1vw; }
#con02 .box3 .inbox1 .ttl1{font-size:5.2vw;line-height: 1.6;letter-spacing: 0.24vw;z-index:3;position:relative;margin-bottom:6vw;font-weight: 500;}
#con02 .box3 .inbox1 .ttl1 span{ display: inline-block; background-color:#fff; margin-bottom:2vw; padding:0 4.83vw 0; }
#con02 .box3 .inbox1 .ttl2{ font-size:4.8vw; font-weight:700; line-height: 1.6; letter-spacing: 0.24vw; margin: 0 0vw 7.24vw; }
#con02 .box3 .inbox1 .txt-box1{ margin: 0 5vw; font-size:3.86vw; line-height: 2; letter-spacing: 0.24vw; }
#con02 .box3 .inbox1 .txt-box1 .mb1{ margin-bottom:5.79vw; }
#con02 .box3 .inbox1 .txt-box1 .pic2{ width: 112%; margin-left: -5vw; margin-bottom:6vw; }
#con02 .box3 .inbox2{ margin:0 4vw 0vw; position:relative; }
#con02 .box3 .inbox2 .pic1{ margin-bottom:8vw; }
#con02 .box3 .inbox2 .txt-box2{ margin: 0 5vw; font-size:3.86vw; line-height: 2; letter-spacing: 0.24vw; }
#con02 .box3 .inbox2 .txt-box2 .mb1{ margin-bottom:5.79vw; }
#con02 .box3 .inbox2 .icon{ margin:0 18vw; }

#con02 .box4{ background-color:#fff; padding: 25vw 0 12vw; }
#con02 .box4 .inbox1{ margin:0 4vw 12vw; position:relative; }
#con02 .box4 .inbox1 .num{ position:absolute; top:-8.86vw; left:3.28vw; right: 14vw; z-index:2 }
#con02 .box4 .inbox1 .pic1{ margin-bottom:-1vw; }
#con02 .box4 .inbox1 .ttl1{ font-size:5.2vw; line-height: 1.6; letter-spacing: 0.24vw; z-index:3; position:relative; margin-bottom:6vw; }
#con02 .box4 .inbox1 .ttl1 span{display: inline-block;background-color:#F7F5F1;margin-bottom:2vw;padding:0 4.83vw 0;font-weight: 500;}
#con02 .box4 .inbox1 .ttl2{ font-size:4.8vw; font-weight:700; line-height: 1.6; letter-spacing: 0.24vw; margin: 0 0vw 7.24vw; }
#con02 .box4 .inbox1 .txt-box1{ margin: 0 5vw; font-size:3.86vw; line-height: 2; letter-spacing: 0.24vw; }
#con02 .box4 .inbox1 .txt-box1 .mb1{ margin-bottom:5.79vw; }
#con02 .box4 .inbox2{ margin:0 4vw 0vw; position:relative; }
#con02 .box4 .inbox2 .pic1{ width:109%; margin-left:-4vw; }
#con02 .box4 .inbox2 .txt-box2{ margin: 0 5vw; font-size:3.86vw; line-height: 2; letter-spacing: 0.24vw; }
#con02 .box4 .inbox2 .txt-box2 .mb1{ margin-bottom:5.79vw; }

#con03{ max-margin:0 auto; padding: 3vw 0 12vw; }
#con03 .ttl{ margin-bottom:8vw; }
#con03 .box1{ margin:0 auto 10vwvw; position:relative; padding:0 0 0; }
#con03 .box1 .pic{ margin:6vw 5vw 6vw; }
#con03 .box1 .txt-box{ margin: 0 7vw; font-size:3.86vw; line-height: 2; letter-spacing: 0.24vw; }
#con03 .box1 .txt-box .mb1{ margin-bottom:5.7vw; }
#con03 .txt2{text-align:center;font-size: 4.6vw;line-height: 2;letter-spacing: 0.24vw;font-weight: 500;}

}