@charset "utf-8";

.mokuji{
text-align: center;
padding: 50px 0;
}
.mokuji h2{
font-size: 32px;
}
.mokuji h2:before{
content: "";
width: 90px;
height: 60px;
display: block;
margin: 0 auto 20px auto;
background-image: url("../img/ic_house01.png");
background-size: 100%;
background-repeat: no-repeat;
}
.mokuji h3{
font-size: 18px;
margin:15px 0 30px;
}
.mokuji ul{
display: flex;
}
.btn_cv2 a{
width: 400px;
display: block;
background-color: #949494;
color: #FFF;
font-size: 18px;
padding: 10px 0;
margin: 0 auto 20px; 
}
.btn_cv2 a:hover{
opacity: 0.8;
}

.tokuten{
text-align: center;
padding: 20px 0 50px;
background-image: url("../img/option_bg_pc.png");
background-size: 100% 250px;
background-repeat: no-repeat;
background-color: #F5F5F5;
}
.tokuten h2{
font-size: 32px;
color: #FFF;
}
.tokuten h2:before{
content: "";
width: 54px;
height: 60px;
display: block;
margin: 0 auto 10px auto;
background-image: url("../img/ic_present.png");
background-size: 100%;
background-repeat: no-repeat;
}
.tokuten h3{
font-size: 24px;
margin:15px 0 15px;
}
.emb01:before{
content: "";
width: 69px;
height: 60px;
display: block;
margin: 0 auto 20px auto;
background-image: url("../img/ic_emb01.png");
background-size: 100%;
background-repeat: no-repeat;
}
.emb02:before{
content: "";
width: 69px;
height: 60px;
display: block;
margin: 0 auto 20px auto;
background-image: url("../img/ic_emb02.png");
background-size: 100%;
background-repeat: no-repeat;
}
.tokuten .listl{
width: 35%;
float: left;
margin: 70px 0 0 10%;
}
.tokuten .listr{
width: 35%;
float: right;
margin: 70px 10% 0 0;
}
.tokuten h4{
font-size: 18px;
font-weight: 100;
margin:15px 0 15px;
}
.tokuten h5{
font-size: 14px;
font-weight: 100;
margin:15px 0;
border: 1px solid #CCC;
padding: 2%;
text-align: center;
}

.event01{
text-align: center;
padding: 20px 0 50px;
background-image: url("../img/event01_bg_pc.jpg"),url("../img/bg_event01color.png"),linear-gradient( to top, #F5F5F5,  #fff );
background-size: 300px,900px 400px,100%;
background-repeat: no-repeat,no-repeat,no-repeat;
background-position:calc(50% + -340px) top,calc(50% + 340px) 420px,100%;
}
.event01 h2{
width: 65%;
text-align: left;
margin: 100px 0 0 35%;
font-size: 36px;
}
.event01 h3{
width: 65%;
text-align: left;
margin: 10px 0 0 35%;
font-size: 16px;
font-weight: 100;
}
.event01 .img01{
width: 480px;
margin: 50px 0 0 150px;
float: left;
}
.event01 .txt01{
width: 320px;
float: right;
margin: 280px 0 0 0;
background-color: #525252;
padding: 15px;
color: #FFF;
text-align: left;
font-size: 14px;
font-weight: 100;
}
.event01 .img02{
width: 480px;
float: right;
margin: 50px 0 0 ;
}
.event01 .txt02{
width: 320px;
float: right;
margin: 280px 0 0 0;
background-color: #525252;
padding: 15px;
color: #FFF;
text-align: left;
font-size: 14px;
font-weight: 100;
}

.event02{
text-align: center;
padding: 20px 0 50px;
background-image: url("../img/event02_bg_pc.jpg"),url("../img/bg_event02color.png"),linear-gradient( to top, #F5F5F5,  #fff );
background-size: 300px,900px 290px,100%;
background-repeat: no-repeat,no-repeat,no-repeat;
background-position:calc(50% + -340px) top,calc(50% + 340px) 380px,100%;
position: relative;
}
.event02 h2{
width: 65%;
text-align: left;
margin: 100px 0 0 35%;
font-size: 36px;
}
.event02 h3{
width: 65%;
text-align: left;
margin: 10px 0 0 35%;
font-size: 16px;
font-weight: 100;
}
.event02 .img01{
width: 420px;
float: left;
margin: 50px 0 0 150px;
}
.event02 .img02{
width: 510px;
float: right;
margin: 120px 0 0 ;
}
.event02 .txt01{
width: 420px;
float: left;
margin: 50px 0 0 0;
text-align: left;
font-weight: 100;
}
.event02 h4{
text-align: left;
font-size: 18px;
}
.event02 h4:before{
content: "";
width: 29px;
height: 46px;
display: block;
margin: 0 15px 0 0;
background-image: url("../img/ic_hand.png");
float: left;
background-size: 100%;
background-repeat: no-repeat;
}
.event02 h5{
text-align: left;
font-size: 14px;
font-weight: 100;
margin-top: 15px;
}

.event03{
text-align: center;
padding: 20px 0 50px;
background-image: url("../img/event03_bg_pc.jpg"),url("../img/bg_event03color.png"),linear-gradient( to top, #F5F5F5,  #fff );
background-size: 300px,900px 330px,100%;
background-repeat: no-repeat,no-repeat,no-repeat;
background-position:calc(50% + -340px) top,calc(50% + 420px) 500px,100%;
position: relative;
}
.event03 h2{
width: 65%;
text-align: left;
margin: 100px 0 0 35%;
font-size: 36px;
}
.event03 h3{
width: 65%;
text-align: left;
margin: 10px 0 0 35%;
font-size: 16px;
font-weight: 100;
}
.event03 .img01{
width: 451px;
float: left;
margin: 50px 0 0 150px;
}
.event03 .img02{
width: 495px;
float: right;
margin: 20px 0 0 ;
}
.event03 .txt01{
margin: 50px auto 0 auto;
font-weight: 100;
background-color: #9ED232;
color: #FFF;
width: 750px;
padding: 10px 0;
}
.event03 h4{
font-size: 18px;
}

.event04{
text-align: center;
padding: 20px 0 50px;
background-image: url("../img/event04_bg_pc.jpg"),url("../img/bg_event04color.png"),linear-gradient( to top, #F5F5F5,  #fff );
background-size: 300px,900px 330px,100%;
background-repeat: no-repeat,no-repeat,no-repeat;
background-position:calc(50% + -340px) top,calc(50% + 540px) 420px,100%;
position: relative;
}
.event04 h2{
width: 65%;
text-align: left;
margin: 100px 0 0 35%;
font-size: 36px;
}
.event04 h3{
width: 65%;
text-align: left;
margin: 10px 0 0 35%;
font-size: 16px;
font-weight: 100;
}
.event04 .img01{
width: 451px;
float: left;
margin: 50px 0 0 150px;
}
.event04 .txt01{
width: 860px;
margin: -50px 0 0 60px;
float: left;
}
.event04 h4{
font-size: 18px;
}

.batchwm{
position: absolute;
width: 120px;
height: 60px;
display: block;
left:calc(50% + -145px) ;
top:35px;
}

.kids{
text-align: center;
padding: 30px 0 50px;
background-image: url("../img/option_bg_pc.png");
background-size: 100% 250px;
background-repeat: no-repeat;
background-color: #F5F5F5;
}
.kids h2{
font-size: 32px;
color: #FFF;
}
.kids h2:before{
content: "";
width: 56px;
height: 60px;
display: block;
margin: 0 auto 10px auto;
background-image: url("../img/ic_kids.png");
background-size: 100%;
background-repeat: no-repeat;
}
.kids h3{
font-size: 16px;
font-weight: 100;
margin:30px 0 15px;
}
.kids p{
width: 250px;
margin:100px auto 15px;
}

.chart{
text-align: center;
padding: 30px 0 50px;
background-image: url("../img/option_bg_pc.png");
background-size: 100% 250px;
background-repeat: no-repeat;
background-color: #F5F5F5;
}
.chart h2{
font-size: 32px;
color: #FFF;
}
.chart h2:before{
content: "";
width: 60px;
height: 60px;
display: block;
margin: 0 auto 10px auto;
background-image: url("../img/ic_chart.png");
background-size: 100%;
background-repeat: no-repeat;
}
.chart h3{
font-size: 26px;
line-height: 210%;
margin:100px auto 15px;
width: 75%;
white-space: nowrap;
}
.chart h3:before{
content: "";
width: 56px;
height: 60px;
display: block;
margin: 0 auto 10px auto;
background-image: url("../img/ic_q.png");
background-size: 100%;
background-repeat: no-repeat;
float: left;
}
.chart p{
width: 520px;
margin:50px 0 15px 40px;
float: left;
}
.chart h4{
width: 290px;
margin:200px 40px 15px;
float: right;
text-align: left;
border: 1px solid #CCC;
padding: 15px;
font-size: 14px;
font-weight: 100;
}
.chart ul{
width: 570px;
margin: 50px auto 0 auto;
}
.chart li{
margin: 0 0 20px;
}

@media screen and (max-width: 980px) {
.event04 .txt01{width: auto;}

}


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

.btn_cv2 a{width: 80%;}

.mokuji{
text-align: center;
padding: 30px 0 40px 0;
}
.mokuji ul{
display:block;
}
.mokuji li{
margin-bottom: 20px;
}
.mokuji h2{
font-size: 5.5vw;
}
.mokuji h2:before{
content: "";
width: 60px;
height: 40px;
display: block;
margin: 0 auto 20px auto;
background-image: url("../img/ic_house01.png");
background-size: 100%;
background-repeat: no-repeat;
}
.mokuji h3{
font-size: 3vw;
margin:15px 0 30px;
}

.tokuten{
padding: 10px 0 50px;
background-image: url("../img/option_bg_sp.png");
background-size: 100%;
}
.tokuten .listl{
width: auto;
float: none;
margin: 60px 0 0 0;
}
.tokuten .listr{
width: auto;
float: none;
margin: 30px 0 0 0;
}
.tokuten h4{
font-size: 3vw;
font-weight: 100;
margin:15px 0 15px;
}
.tokuten h2{
font-size: 5.5vw;
color: #FFF;
}
.tokuten h2:before{
content: "";
width: 37px;
height: 40px;
display: block;
margin: 0 auto 10px auto;
background-image: url("../img/ic_present.png");
background-size: 100%;
background-repeat: no-repeat;
}
.tokuten h3{
font-size: 5vw;
margin:15px 0 15px;
}
.tokuten h4{
font-size: 3.5vw;
}
.tokuten h5{
font-size: 3vw;
text-align: center;
}
.emb01:before{
content: "";
width: 69px;
height: 60px;
display: block;
margin: 0 auto 20px auto;
background-image: url("../img/ic_emb01.png");
background-size: 100%;
background-repeat: no-repeat;
}
.emb02:before{
content: "";
width: 69px;
height: 60px;
display: block;
margin: 0 auto 20px auto;
background-image: url("../img/ic_emb02.png");
background-size: 100%;
background-repeat: no-repeat;
}



.event01{
text-align: center;
padding: 20px 0 50px;
background-image: url("../img/event01_bg.jpg"),url("../img/bg_event01color.png"),url("../img/bg_event01color.png");
background-size: 100%,40% 20%,40% 20%;
background-repeat: no-repeat,no-repeat,no-repeat;
background-position:0 0,calc(50% + 80%) 40%,calc(50% + -80%) 82%;
}
.event01 h2{
width: 100%;
text-align: center;
margin: 0 0 0 0;
font-size: 6vw;
}
.event01 h2:before{
content: "";
width: 150px;
height: 56px;
display: block;
margin: 0 auto 20px auto;
background-image: url("../img/ic_event01.png");
background-size: 100%;
background-repeat: no-repeat;
}
.event01 h3{
width: 100%;
text-align: center;
margin: 10px 0 0 0;
font-size: 3.8vw;
font-weight: 100;
}
.event01 .img01{
width: 65%;
margin: 20px 0 0 0;
float: none;
}
.event01 .txt01{
width: auto;
margin: 0 0 0 0;
float: none;
background-color: transparent;
padding: 3%;
color: #000;
text-align: left;
font-size: 3.5vw;
font-weight: 100;
}
.event01 .img02{
width: 65%;
margin: 20px 0 0 0;
float: right;
}
.event01 .txt02{
width: 94%;
margin: 0 0 0 0;
float: left;
background-color: transparent;
padding: 3%;
color: #000;
text-align: left;
font-size: 3.5vw;
font-weight: 100;
}

.event02{
text-align: center;
padding: 20px 0 50px;
background-image: url("../img/event02_bg.jpg"),url("../img/bg_event02color.png");
background-size: 100%,80% 30%;
background-repeat: no-repeat,no-repeat;
background-position:0 0,calc(50% + 50%) 50%;
}
.event02 h2{
width: 100%;
text-align: center;
margin: 0 0 0 0;
font-size: 6vw;
}
.event02 h2:before{
content: "";
width: 150px;
height: 62px;
display: block;
margin: 0 auto 20px auto;
background-image: url("../img/ic_event02.png");
background-size: 100%;
background-repeat: no-repeat;
}
.event02 h3{
width: 96%;
text-align: center;
margin: 10px 2% 0 2%;
font-size: 3.6vw;
line-height: 180%;
font-weight: 100;
}
.event02 .img01{
width: 65%;
margin: 20px 0 0 0;
float: none;
}
.event02 .img02{
width: auto;
margin: 20px 3% 0 3%;
float: none;
}
.event02 .txt01{
width: auto;
margin: 20px 0 0 0;
float: none;
text-align: left;
font-weight: 100;
}
.event02 h4{
text-align: left;
font-size: 4vw;
}
.event02 h4:before{
content: "";
width: 34px;
height: 54px;
display: block;
margin: 5px 15px 0 15px;
background-image: url("../img/ic_hand.png");
float: left;
background-size: 100%;
background-repeat: no-repeat;
}
.event02 h5{
text-align: left;
font-size: 3.5vw;
line-height: 180%;
font-weight: 100;
margin: 15px 3% 15px 64px;
}

.event03{
text-align: center;
padding: 20px 0 50px;
background-image: url("../img/event03_bg.jpg");
background-size: 100%;
background-repeat: no-repeat;
background-position:0 0;
}
.event03 h2{
width: 100%;
text-align: center;
margin: 0 0 0 0;
font-size: 6vw;
}
.event03 h2:before{
content: "";
width: 150px;
height: 68px;
display: block;
margin: 0 auto 20px auto;
background-image: url("../img/ic_event03.png");
background-size: 100%;
background-repeat: no-repeat;
}
.event03 h3{
width: 94%;
text-align: center;
margin: 10px 3% 0 3%;
font-size: 3.8vw;
font-weight: 100;
}
.event03 .img01{
width: auto;
margin: 20px 3% 0 0;
float: none;
}
.event03 .img02{
width: auto;
margin: 20px 0 0 3%;
float: none;
}
.event03 .txt01{
width: 74%;
margin: 20px auto 0 auto;
float: none;
font-weight: 100;
background-color: #F7FAEF;
color: #000;
padding:3%;
}
.event03 h4{
font-size: 18px;
}

.event04{
text-align: center;
padding: 20px 0 50px;
background-image: url("../img/event04_bg.jpg"),url("../img/bg_event04color.png"),url("../img/bg_event04color.png");
background-size: 100%,40% 20%,40% 20%;
background-repeat: no-repeat,no-repeat,no-repeat;
background-position:0 0,calc(50% + 80%) 40%,calc(50% + -80%) 82%;
}
.event04 h2{
width: 100%;
text-align: center;
margin: 0 0 0 0;
font-size: 6vw;
}
.event04 h2:before{
content: "";
width: 150px;
height: 56px;
display: block;
margin: 0 auto 20px auto;
background-image: url("../img/ic_event04.png");
background-size: 100%;
background-repeat: no-repeat;
}
.event04 h3{
width: 94%;
text-align: center;
margin: 10px 3% 0 3%;
font-size: 3.8vw;
font-weight: 100;
}
.event04 .img01{
width: 65%;
margin: 20px 0 0 0;
float: none;
}
.event04 .txt01{
width: auto;
margin: -40px 3% 0 3%;
float: none;
}
.event04 .txt02{
width: auto;
margin: 20px 3% 0 3%;
float: none;
background-color: #79D6CC;
padding: 3%;
font-size: 5vw;
font-weight: 900;
color: #FFF;
}
.event04 h4{
font-size: 18px;
}

.batchwm{
position: absolute;
width: 24%;
height: 12%;
display: block;
left:auto;
right: 4%;
top:2.2%;
}

.kids{
text-align: center;
padding: 10px 0 30px;
background-image: url("../img/option_bg_sp.png");
background-size: 100% ;
background-repeat: no-repeat;
background-color: #F5F5F5;
}
.kids h2{
font-size: 6vw;
color: #FFF;
}
.kids h2:before{
content: "";
width: 38px;
height: 40px;
display: block;
margin: 0 auto 10px auto;
background-image: url("../img/ic_kids.png");
background-size: 100%;
background-repeat: no-repeat;
}
.kids h3{
font-size: 4vw;
font-weight: 100;
margin:30px 0 15px;
text-align: left;
}
.kids p{
width: 60%;
margin:20% auto 15px;
}

.chart{
text-align: center;
padding: 20px 0 40px;
background-image: url("../img/option_bg_sp.png");
background-size: 100% 200px;
background-repeat: no-repeat;
background-color: #F5F5F5;
}
.chart h2{
font-size: 6vw;
color: #FFF;
}
.chart h2:before{
content: "";
width: 40px;
height: 40px;
display: block;
margin: 0 auto 10px auto;
background-image: url("../img/ic_chart.png");
background-size: 100%;
background-repeat: no-repeat;
}
.chart h3{
font-size: 4.8vw;
line-height: 160%;
text-align: left;
width: auto;
margin: 60px 0 0 0;
float: none;
white-space: normal;
}
.chart h3:before{
content: "";
width: 40px;
height: 40px;
display: block;
margin: 8px 3% 10px auto;
background-image: url("../img/ic_q.png");
background-size: 100%;
background-repeat: no-repeat;
float: left;
}
.chart p{
width: auto;
margin: 20px 0 0 0;
float: none;
}
.chart h4{
width: auto;
margin: 20px 0 0 0;
float: none;
text-align: left;
border: 1px solid #CCC;
padding: 3%;
font-size: 3.6vw;
font-weight: 100;
}
.chart ul{
width: auto;
margin: 40px 8% 0 8%;
float: none;
}
.chart li{
margin: 0 0 15px;
}

}


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

}