@charset "utf-8";
body{background: #fff;}
body #spot.gashapon{max-width: 460px; margin: 0 auto; padding: 57px 6% 112px;}
body #spot.gashapon .header{ text-align: center; padding: 0 0 36px;}
body #spot.gashapon .header h2{font-size: 30px;font-family: "fot-tsukuaoldmin-pr6n", sans-serif; font-weight: 300; font-style: normal;}
body #spot.gashapon .header h2 span{display: inline-block; color: #fff; font-size: 21px; background: #d8304a; margin: 0 0 28px; padding: 8px 25px; font-family: "source-han-sans-japanese", sans-serif; font-weight: 500; font-style: normal;}
body #spot.gashapon .header img{display: inline-block; padding: 0 0 5px; width: 100%; height: auto;}

body #spot.gashapon .main p{line-height: 180%; text-align: center;font-family: "source-han-sans-japanese", sans-serif; font-weight: 400; font-style: normal;}
body #spot.gashapon .main form{padding: 40px 0 0;}
body #spot.gashapon .main form .ipu_box{width: 100%;}
body #spot.gashapon .main form .ipu_box input{border: 1px solid #8e8f9d; color: #000;  padding: 26px 18px; width: 92.5%;font-family: "source-han-sans-japanese", sans-serif; font-weight: 300; font-style: normal; line-height: 120%; -webkit-appearance: none; appearance: none; background: #fff;}
body #spot.gashapon .main form .ipu_box input:not(:first-child){margin: 27px 0 0;font-family: "source-han-sans-japanese", sans-serif; font-weight: 300; font-style: normal;}
body #spot.gashapon .main form .ipu_box .select_box{position: relative;margin: 27px 0 0;}
body #spot.gashapon .main form .ipu_box .select_box:before{content: "";position: absolute; width: 8px; height: 8px;border-bottom: 1px solid #8e8f9d; border-right: 1px solid #8e8f9d; transform: rotate(-135deg); right: 20px; top: 25px;}
body #spot.gashapon .main form .ipu_box .select_box:after{content: "";position: absolute; width: 8px; height: 8px;border-bottom: 1px solid #8e8f9d; border-right: 1px solid #8e8f9d; transform: rotate(45deg); right: 20px; bottom: 25px;}

body #spot.gashapon .main form .ipu_box select{width: 100%; padding: 26px 18px;border: 1px solid #8e8f9d; /* color: #9b9b9b;   */color: #000;line-height: 120%; -webkit-appearance: none;  appearance: none; background: #fff;}

body #spot.gashapon .main form .btn {padding: 51px 0 26px; margin: 0 auto; width: 370px;}
body #spot.event .main form .btn {padding: 51px 0 26px; margin: 0 auto; width: 370px;}
body #spot.event .main form .btn input[type="submit"] { border: none; font-size: 26px; font-weight: 500; padding: 28px 0;line-height: 100%;height: auto;font-family: "source-han-sans-japanese", sans-serif; font-weight: 500; font-style: normal; background: #de5066;  color: #fff; border-radius: 100px;-webkit-appearance: none;  appearance: none; display: block; width: 100%; }

body #spot.gashapon .main form .btn input[type="submit"] { border: none; font-size: 26px; font-weight: 500; padding: 28px 0;line-height: 100%;height: auto;font-family: "source-han-sans-japanese", sans-serif; font-weight: 500; font-style: normal; background: #de5066;  color: #fff; border-radius: 100px;-webkit-appearance: none;  appearance: none; display: block; width: 100%; }
body #spot .main form .btn .terms_btn { border: none; font-size: 26px; font-weight: 500; padding: 28px 0;line-height: 100%;height: auto;font-family: "source-han-sans-japanese", sans-serif; font-weight: 500; font-style: normal; color: #fff; border-radius: 100px;-webkit-appearance: none;  appearance: none; display: block; width: 100%; }


body #spot .main form .btn .terms_btn::after {display: none;}
body #spot.gashapon .main form .btn a:after{display: none;}
body #spot.gashapon .main .ink_tt{text-align: center; width: 100%; }
body #spot.gashapon .main .ink_tt a{color: #000; display: inline-block;text-decoration: none; border-bottom: 1px solid #b5b5b5; font-family: "source-han-sans-japanese", sans-serif; font-weight: 300; font-style: normal;padding: 0 0 5px;}
body #spot.gashapon .main .ink_tt a:after{display: none;}


/*----------------#spot.event----------------*/

body.event_body .bg_color{width: 100%; max-width: 740px;  margin: auto;  position: relative; padding: 20px;box-sizing: border-box;border-radius: 20px;background: url(../images/common/bg.jpg) center bottom/cover;}

body.event_body .bg_box{background: url(../images/gashapon/bg_2.jpg) no-repeat center center; background-size: cover;  width: 100%;padding: 151px 0;;}
body.event_body .bg_box.out_box{background: #ffeef0;}
body .img_2{width: 841px; height: auto; position: absolute; top: -39px; left: 49%;transform: translateX(-50%);-webkit-transform: translateX(-50%); z-index: 1;}
body #spot.event{ margin: 0 auto;  background: #fff; border-radius: 20px;  padding: 0px;z-index: 1;}
body #spot.event .event_box{padding: 43px 6% 51px;}
body #spot.event .header{background: url(../images/gashapon/bg_1.png) no-repeat center bottom; background-size: cover; padding: 82px 0 0 ;width: 500px; margin: 0 auto 25px;}
body #spot.event .header.out{background: none; width: 100%; text-align: center; padding: 20px 0 0;}
body #spot.event .header.out h2{line-height: 160%;}
body #spot.event .header.out h2 span{font-size: 40px;}
body #spot.event .header h2 {text-align: center;font-size: 30px;font-family: "source-han-sans-japanese", sans-serif; font-weight: 500; text-align: center; line-height: 160%;}
body #spot.event .header h2 span{font-size: 44px; font-weight: 400;}
body #spot.event .main .img{padding: 0 0 22px;}
body #spot.event .main .box h3{text-align: center;font-size: 30px;font-family: "source-han-sans-japanese", sans-serif; font-weight: 500; border: 4px solid; border-image: linear-gradient(90deg,  #fac7e7,#c3a8eb,#a1d7ee) 1; padding: 17px 0; margin: 0 0 25px; line-height: 130%;}

body.event_body .bg_box.out_box .main .box h3{border: none !important; border-image: none !important;}

body #spot.event .main .box p{line-height: 180%; margin: 0 0 50px; text-align: center;}
body #spot.event .main .box .clos{display: block;border: 1px solid #000; width: 240px; margin: 0 auto; padding: 10px 0;text-decoration: none;font-family: "source-han-sans-japanese", sans-serif; font-weight: 500; font-style: normal; text-align: center; border-radius: 50px; color: #000;}

.confirm { padding: 60px 0; }
.confirm .alert { padding: 0 0 60px !important; }
.confirm .alert span { display: block; color: #f22727; line-height: 150%; }
#spot .confirm .btn .back { background: #787878; }
#spot .confirm .btn .back::after { display: none; }

.notice { padding: 50px 0 0; }
.notice.sub_box{padding:30px 0 0;}

.kiyaku { overflow: auto; height: 200px; text-align: left; border: 1px solid #ededed; padding: 20px; }
.kiyaku.none_over{overflow: auto; height: auto;border: none;}
.kiyaku.none_over {padding: 20px 20px 0px;}
body #spot .main .kiyaku p { text-align: left; font-size: 14px; padding: 0 0 20px;}
.kiyaku h3 { padding: 0 0 10px; font-weight: bold;}
.kiyaku h4 { padding: 0 0 10px; font-weight: bold;}
.kiyaku h5 { padding: 0 0 10px; font-weight: bold;}

.notice .agreement { text-align: left; padding: 50px 0 0;}
.notice.sub_box .agreement {padding: 20px 20px 0;}
.notice .agreement label { padding: 0 0 0 10px; line-height: 150%; }
body #spot.gashapon .main .notice .agreement p { display: flex; text-align: left; padding: 0 0 20px;}
body #spot.event .main .notice .agreement p { display: flex; text-align: left; padding: 0 0 20px;}

body #spot .main form .btn input[type="submit"]:disabled { background: #949494; }
body #spot .main form .btn .terms_btn { background: #de5066; }
body #spot .main form .btn .disabled {pointer-events: none;background: #949494;}

body #spot .main .oubo { padding: 30px 0 ; }
body #spot .main .oubo h3 { font-size: 20px; font-weight: bold; text-align: center; padding: 0 0 20px;}
body #spot .main .notice.sub_box h3.terms { font-size: 20px; font-weight: bold; text-align: center; padding: 0 0 20px;}
body #spot .main .oubo ol li { list-style-type: decimal; padding: 0 0 10px; line-height: 150%; text-align: center; display: block;}
body #spot .main .oubo ol li a{color: #000;display: inline-block;text-decoration: none;border-bottom: 1px solid #b5b5b5;font-family: "source-han-sans-japanese", sans-serif;font-weight: 300;padding: 0 0 5px;display: inline-block;}
body #spot .main .oubo h4 { font-weight: bold; font-size: 16px; padding: 0 0 20px;}
body #spot .main .oubo p { text-align: left; }
body #spot .main .oubo p.question { background: #ffd6d6 ; padding: 10px 30px 10px 10px; position: relative;} 
body #spot .main .oubo p.question span.close{display: inline-block; position: absolute; width: 16px; height: 16px; margin-left: auto; top: 50%;right: 2%;transform: translateY(-50%); -webkit-transform: translateY(-50%) }
body #spot .main .oubo p.question span.close:before{width: 16px; height: 2px; background: #000; content: ""; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);}
body #spot .main .oubo p.question span.close:after{ width: 16px; height: 2px; background: #000; content: ""; display: block; transition: 0.5s; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%) rotateZ(-90deg); -webkit-transform:translate(-50%,-50%) rotateZ(-90deg);}
body #spot .main .oubo p.question.open span.close:after{transform: translate(-50%,-50%) rotateZ(0deg); -webkit-transform:translate(-50%,-50%) rotateZ(0deg); transition: 0.5s;}


body #spot .main .oubo .tt_box:not(.last){margin: 0 0 20px;}
body #spot .main .oubo p.answer { padding: 20px 10px 0px; }
body #spot .main .oubo .oubohouhou { background: #fff7e6; padding: 30px; margin-bottom: 40px;}

body #spot .main .link_flex{display: flex; justify-content: space-between; padding: 0 0 30px;}
body #spot .main .link_flex a:nth-child(1){margin-right: 4%;}
body #spot .main .link_flex a{width: 48%; height: auto; display: inline-block;}
@media only screen and (max-width:640px){
	body #spot.gashapon{max-width: 460px; margin: 0 auto; padding: 27px 6% 56px;}
	body #spot.gashapon .header{  padding: 0 0 18px;}
	body #spot.gashapon .header h2{font-size: 20px;}
	body #spot.gashapon .header h2 span{ font-size: 15px;  margin: 0 0 14px; padding: 6px 12px; }
	body #spot.gashapon .header img{ padding: 0 0 5px;}
	
	body #spot.gashapon .main p{font-size: 13px;}
	body #spot.gashapon .main form{padding: 20px 0 0;}
	body #spot.gashapon .main form .ipu_box{width: 100%;}
	body #spot.gashapon .main form .ipu_box input{ padding: 13px 9px; width: 92.5%;font-size: 13px;}
	body #spot.gashapon .main form .ipu_box input:not(:first-child){margin: 14px 0 0;}
	
	
	body #spot.gashapon .main form .ipu_box .select_box{margin: 14px 0 0;}
	body #spot.gashapon .main form .ipu_box .select_box:before{ width: 6px; height: 6px; right: 15px; top: 12px;}
	body #spot.gashapon .main form .ipu_box .select_box:after{width: 6px; height: 6px;right: 15px; bottom: 12px;}
	
	body #spot.gashapon .main form .ipu_box select{padding: 13px 9px;  font-size: 13px;width: 98%; border-radius: 5px;}
	
	body #spot.gashapon .main form .btn {padding: 25px 0 13px; width: 185px;}
	body #spot.event .main form .btn {padding: 25px 0 13px; width: 185px;}
	body #spot.gashapon .main form .btn a{font-size: 16px; padding: 14px 0;}
	body #spot.gashapon .main .ink_tt a{padding: 0 0 5px; font-size: 13px;}

/*----------------#spot.event----------------*/
	body.event_body .bg_box{height: 85vh; padding: 75px 0 ; }
	body.event_body .faq_box.bg_box,
	body.event_body .terms_box.bg_box{height: 100%; padding: 75px 0 ; }
	body.event_body .bg_box.out_box{}
	body.event_body .bg_color{ padding: 10px;width: 90%;}
	body.event_body .img_2{width: 99%; height: auto; top: 0%; left: 49%;}
	body #spot.event .event_box{padding: 21px 5% 25px;}
	body #spot.event .header{padding: 41px 0 0 ;width: 100%; margin: 0 auto 12px; max-width: 245px;}
	body #spot.event .header.out{padding: 20px 0 5px; }
	body #spot.event .header.out  h2 span{font-size: 25px;}
	body #spot.event .header h2{font-size: 15px;}
	body #spot.event .header h2 span{font-size: 24px; }
	body #spot.event .main .img{padding: 0 0 11px; width: 100%;}
	body #spot.event .main .img img{width: 100%; height: auto;	}
	body #spot.event .main .box h3{font-size: 18px; padding: 10px 0; margin: 0 0 12px;}
	body #spot.event .main .box p{font-size: 13px; margin: 0 0 25px;}
	body #spot.event .main .box .clos{width: 100%; margin: 0 auto; padding: 10px 0;font-size: 13px; max-width: 130px;}

}