@charset "UTF-8";


	@media all and (max-width: 1024px) {
		.main_contents_box{width:95% !important;height:auto;margin:0px auto;padding:0px 0px;}
	}

/*======*/
div.system{max-width:1200px;width:100%;height:auto;margin:0px auto;padding-top:20px;}
div.cource{max-width:1200px;width:100%;height:auto;margin-bottom:20px;padding:15px 0px;background:rgb(255,255,255,0.05);position:relative;}
div.cource_in{width: calc(100% - 30px);height:auto;margin:0px auto;padding:20px 0px 0px 0px;}
ul.cource{width:100%;height:auto;margin:0px auto;padding:3px 0px 40px 0px;display: -ms-flexbox;display: flex;-ms-flex-pack: center;justify-content:center;-webkit-flex-wrap: wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}
ul.cource li{width:29%;height:auto;margin:9px 2%;padding-bottom:3px;font-size:20px;border-bottom:1px solid #e7d9c7;
display: -ms-flexbox;display: flex;-ms-flex-pack: center;justify-content:center;-webkit-flex-wrap: wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;align-items: flex-start;align-content: flex-start;}
ul.cource li .l{display:inline-block;width:42.5%;height:auto;margin:0px auto;padding:2px 0px 0px 5.5%;text-align:left;color:#6cb0ff;background: url(../img_new/common/li.png) no-repeat;background-size:7px auto;background-position:0px 8px;}
ul.cource li .r{display:inline-block;width:51%;height:auto;margin:0px auto;padding:2px 1% 0px 0px;text-align:right;letter-spacing:1px;}
ul.cource li .c{display:inline-block;width:100%;height:auto;margin:0px auto;padding-top:3px;color:#231803;border-top:1px solid #460002;font-size:12px;}
ul.cource li .l .ja_c{font-size:13px;vertical-align:0px;}
ul.cource li .r .ja_c{font-size:13px;vertical-align:0px;}
ul.cource li small{font-size:13px;}
div.system ul.cource:nth-of-type(1) , div.system ul.cource:nth-of-type(2){padding-bottom:20px;}
.recom{animation:BLINK 0.8s ease-in-out infinite alternate;display:inline-block;padding-right:1px;}
@keyframes BLINK {0%{opacity:1.0;}100% {opacity:0;}}
p.off{width:100%;height:auto;padding:10px 0px;font-size:14px;}
	@media all and (min-width: 1025px) {
		ul.cource.c li{width:33%;}
	}
	@media all and (max-width: 1024px) {
		div.system{width:95%;}
		ul.cource{padding:3px 0px 30px 0px;}
		ul.cource li{width:91%;font-size:18px;margin:6px 2%;}
		ul.cource li .l .ja_c{font-size:11px;}
		ul.cource li .r .ja_c{font-size:11px;}
		ul.cource li .l{width:39.5%;}
		ul.cource li .r{width:54%;}
		ul.cource.c li .l{width:52.5%;}
		ul.cource.c li .r{width:40%;}
		p.off{font-size:12px;line-height:150%;}
	}

/*======*/
ul.play{width:100%;height:auto;margin:0px auto;padding:20px 0px 0px 0px;display: -ms-flexbox;display: flex;-ms-flex-pack: center;justify-content:center;-webkit-flex-wrap: wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}
ul.play li{width:10%;height:auto;margin:0px 1%;padding-bottom:5px;font-size:13px;}
ul.play span{display:block;width:auto;height:auto;margin:0px auto;padding:0px 0px 0px 0px;background:#877552;color:#ffffff;line-height:200%;
border-radius:2px;-webkit-border-radius:2px;-moz-border-radius:2px;}
	@media all and (max-width: 1024px) {
		ul.play{width:91%;}
		ul.play li{width:49%;}
		ul.play li:nth-child(odd){margin:0px 1% 0px 0px;}
		ul.play li:nth-child(even){margin:0px 0px 0px 1%;}
	}

/*======*/
div.etc_charge{max-width:1200px;width:100%;height:auto;margin-bottom:20px;padding:15px 0px;background:rgb(255,255,255,0.05);position:relative;}
div.etc_charge_in{width: calc(100% - 30px);height:auto;margin:0px auto;padding:20px 0px;}
div.etc_charge dl{width:98%;height:auto;margin:0px auto;padding:10px 0px 5px 0px;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-ms-flex-align: center;align-items: center;-ms-flex-pack: center;justify-content: center;}
div.etc_charge dl:nth-of-type(1),div.etc_charge dl:nth-of-type(2),div.etc_charge dl:nth-of-type(3){padding:10px 0px 10px 0px;}
div.etc_charge dl div{width:33%;height:auto;margin:0px auto;padding:5px 0px;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-ms-flex-align: center;align-items: center;-ms-flex-pack: center;justify-content: center;}
div.etc_charge dl div dt{width:60%;height:auto;margin:0px 0% 0px 0px;padding:8px 0px;line-height:100%;background: #877552;color:#efefef;position:relative;}
div.etc_charge dl div dd{width:33%;height:auto;margin:0px 0% 0px 0px;padding:8px 0px;line-height:100%;background:#ffffff;color:#222222;border-bottom: 1px solid #ffffff;border-top: 1px solid #ffffff;border-right: 1px solid #ffffff;box-sizing:border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;}
div.etc_charge p{width:90%;margin:0px auto;padding:10px 0px 0px 0px;}
	@media all and (min-width: 1025px) {
		div.etc_charge dl div dt:after{content:" ";display:inline-block;position:absolute;top:calc(50% - 5.5px);right:-4px;width: 0;height: 0;border-style: solid;border-width: 5.5px 0 5.5px 5px;border-color: transparent transparent transparent #877552;}
		div.etc_charge dl div dt{border-bottom: 1px solid #877552;border-top: 1px solid #877552;}
	}
	@media all and (max-width: 1024px) {
		div.etc_charge dl div{width:91%;}
		div.etc_charge dl div dt{width:100%;}
		div.etc_charge dl div dd{width:100%;border-top:0px;border-bottom: 1px solid #ffffff;border-left: 1px solid #ffffff;border-right: 1px solid #ffffff;box-sizing:border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;}
		div.etc_charge dl div dt:after{content:"";display:inline-block;position:absolute;bottom:-4px;left:calc(50% - 8px);width: 0;height: 0;border-style: solid;border-width: 5px 7px 0 7px;border-color: #877552 transparent transparent transparent;}
	}


/*======*/
div.system h2.en{width:100%;height:auto;margin:0px auto;padding:0px 0px 10px 0px;font-size:21px;letter-spacing:0.5px;line-height:100%;color:#4e2509;}
div.system h2.en span{display:inline-block;width:auto;height:auto;margin:0px auto;padding:0px 16px 0px 16px;
background:url(../img/icon/heart_yellow.png),url(../img/icon/heart_yellow.png);background-repeat:no-repeat,no-repeat;background-size:11px 9px,11px 9px;background-position:0% 50%,100% 50%;}

/*======*/
h3.h3{width:auto;height:auto;position:relative;}
h3.h3 span.en{display:inline-block;width:auto;height:auto;padding:0px 70px 1px 70px;font-size:21px;letter-spacing:1px;line-height:100%;
background:url(../img_new/common/wing_l.png),url(../img_new/common/wing_r.png);background-repeat:no-repeat,no-repeat;background-size:61px 15px,61px 15px;background-position:0% 50%,100% 50%;}
h3.h3 span.ja{display:block;width:auto;height:auto;padding:2px 0px 0px 0px;font-size:12px;letter-spacing:0px;line-height:100%;color:#877552;}
	@media all and (max-width: 1024px) {
		h3.h3{padding:10px 0px;}
		h3.h3 span.en{font-size:18px;}
		h3.h3 span.en{padding:0px 55px 1px 55px;background:url(../img_new/common/wing_l.png),url(../img_new/common/wing_r.png);background-repeat:no-repeat,no-repeat;background-size:48px 12px,48px 12px;background-position:0% 50%,100% 50%;}
		h3.h3:before{font-size:50px;position:absolute;top:8px;left:0px;}
	}

/*======*/
h3.intro{width:100%;height:auto;margin:0px auto;padding:0px 0px 10px 0px;font-size:17px;letter-spacing:1px;line-height:100%;color:#877552;}
p.intro{width:100%;height:auto;margin:0px auto;padding:0px 0px 30px 0px;font-size:14px;letter-spacing:1px;line-height:150%;color:#ffffff;}
	@media all and (max-width: 1024px) {
		h3.intro{font-size:15px;}
		p.intro{font-size:13px;}
	}

/*======*/
div.system h4{width:100%;height:auto;margin:0px 10px 0px 0px;padding:0px;color:#ffffff;font-size:14px;letter-spacing:1px;line-height:120%;}
div.system h4 span{display:inline-block;margin:0px auto;padding:0px 14px;background:url(../img/icon/heart_yellow.png),url(../img/icon/heart_yellow.png);background-repeat:no-repeat,no-repeat;background-size:11px 9px,11px 9px;background-position:0% 50%,100% 50%;}

/*======*/
.rule_box{width:100%;height:auto;margin:0px auto;padding-top:25px;}
div.rule {width:100%;height:auto;margin:0px auto;padding-top:10px;}
.rule p:nth-of-type(1){width:100%;height:auto;margin:0px auto;padding:0px;text-align:left;}
.rule p:nth-of-type(2){width:100%;height:auto;margin:0px auto;padding:0px;text-align:left;}
.rule p:nth-of-type(3){width:100%;height:auto;margin:0px auto;padding-top:10px;text-align:left;}
.rule p:nth-of-type(4){width:100%;height:auto;margin:0px auto;padding:0px;text-align:left;}
.rule ul{width:99%;height:auto;margin:15px auto;padding:0px;text-align:left;}
.rule ul li{width:48.5%;height:auto;margin:0px 0.5%;padding:0px;text-align:left;display:inline-block;text-indent:13px;background: url(../img_new/common/li.png) no-repeat;background-size:7px auto;background-position:0px 6px;}
	@media all and (max-width: 1024px) {
		.rule ul li{width:98%;margin:0px 0px 0px 2%;}
	}