@charset "utf-8";

.base-wp{background:url(../img/common/cont-common-bg.jpg) top center no-repeat; -moz-background-size:100% auto; background-size:100% auto; animation-name: fade-inanime; animation-duration: 2s; background-attachment:fixed;}

.system-crumb{background:url(../img/system/system-crumb.png)top center repeat-y; -moz-background-size:80% auto; background-size:80% auto;}

h2{width: 95%; max-width: 924px; margin: 0 auto 5% auto; padding: 180px 0 0 0;}
h3{width: 95%; max-width: 924px; margin: 0 auto 5% auto; padding: 5% 0 0 0;}
h4{width: 95%; max-width: calc(1000px - 4%); margin: 0 auto 5px auto; padding: 1% 2%; background:#e43262; color:#fff; font-size: 18px;}
h5{width: 95%; max-width: calc(1000px - 4%); margin: 5% auto 0 auto; padding: 1% 2%; color:#fff; font-size: 18px; background:url(../img/system/difficult-title-type2.png)top left no-repeat; -moz-background-size:auto 100%; background-size:auto 100%;  }

h6{width: 97%; max-width: calc(1000px - 4%); margin: 3% auto 2% auto; padding: 0.5% 2%; background:#605d77; color:#fff; font-size: 18px;}
.sub-title{width: 100%; margin: 2% auto 0 auto; padding: 3% 0% 0 0%; font-size: 18px; font-weight: 600; border-bottom: solid 1px #605d77;}

.system-tab-difficulty{width: 98%; max-width: 780px; margin: 0 auto;}
.system-tab-difficulty li, .system-tab-difficulty2 li{padding:0.5%;}
.system-tab-difficulty li a:hover, .system-tab-difficulty2 li a:hover{filter: contrast(140%);}
.system-tab-difficulty2{width: 98%; max-width: 780px; margin: 0 auto; padding-bottom: 5%;}

.text-box{width: 95%; max-width: calc(1000px - 4%); margin: 0 auto 5px auto; padding: 1% 2%; background-color:rgba(255,255,255,0.65); color:#605d77; font-size: 16px; line-height:1.61;}
.txt-box-full{width: 95%; max-width: calc(1000px - 4%); margin: 0 auto 5px auto; padding: 1% 2%; background-color:rgba(255,255,255,0.65); color:#605d77; font-size: 16px; line-height:1.61;}

.cont1-box1{width: 95%; max-width: 1000px; margin: 15px auto 5px auto;}
.cont1-txt{width: 48%; background-color:rgba(255,255,255,0.65); padding: 1% 2%; color:#605d77; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-wrap: wrap; -webkit-align-items: center; align-items: center; font-size: 16px; line-height:1.61;}
.cont1-txt p{width: 100%; display:block; padding:0; padding-bottom: 0.5%;}
.cont1-img{width: calc(46% - 14px); margin-left:2%; position: relative;}

.ss-box-3type{width: 100%; padding: 2% 0;}
.ss-box-3type li{width: 32%; padding:0.5%; position: relative;}
.ss-at{font-size: 13px; margin-top:3px;}
.ss-at2{font-size: 20px; font-weight: 600;}


.ss-box-2type-txt-left{width: 100%; margin: 15px auto 5px auto;}
.txt-box-left1{width: 48%; padding: 1% 2% 1% 0; color:#605d77;  font-size: 16px; line-height:1.61;}
.txt-box-left1 p{width: 100%; display:block; margin: 0; padding-bottom: -2%;}
.ss-box-right1{width: calc(50% - 14px); position: relative;}


.ss-box-2type-txt-right{width: 100%; margin: 15px auto 5px auto;}
.txt-box-right1{width: 48%; padding: 1% 0 1% 2%; color:#605d77;  font-size: 16px; line-height:1.61;}
.txt-box-right1 p{width: 100%; display:block; margin: 0; padding-bottom: -2%;}
.ss-box-left1{width: calc(50% - 14px); position: relative;}

.sub-cont-title{font-weight: bold;}
.sub-cont-box{padding: 1% 0 3% 0;}
.sub-cont-box2{padding: 1% 0 0 0;}


.ss-box-2type{width: 100%; padding: 2% 0;}
.ss-box-2type li{width: 49%; padding:0.5%; position: relative;}


.ss-box-1type{width: 100%; max-width:550px; padding: 2% 0; margin: 0 auto; position: relative;}


.cont10-box{width: 95%; max-width: 900px; margin: 0 auto 0 auto; padding-bottom: 5%;}


strong.red{color:#e53766;}



.base-wp a:link { color: #4858d6; text-decoration: underline;}
.base-wp a:visited { color: #4858d6; }
.base-wp a:hover { color: #4858d6; text-decoration: none;}
.base-wp a:active { color: #4858d6; }


.news-list{width: 95%; max-width: 970px; margin: 0 auto 5px auto; padding: 1%; background:#e0dfe6; color: #605d77; line-height:1.61;}

.news-new-icon-title{width: 10%; max-width: 35px;  display:inline-block;
    -webkit-animation: blink 1.5s ease-in-out infinite alternate;
    -moz-animation: blink 1.5s ease-in-out infinite alternate;
    animation: blink 1.5s ease-in-out infinite alternate;
}
.news-new-icon-title img{height: 30px; }


.redline{display:block; box-shadow:25px 22px 0px -14px #e33363;  -webkit-box-shadow:25px 22px 0px -14px #e33363; -moz-box-shadow:25px 22px 0px -14px #e33363;}

.redline2{display:block; box-shadow:19px 18px 0px -14px #e33363;  -webkit-box-shadow:19px 18px 0px -14px #e33363; -moz-box-shadow:19px 18px 0px -14px #e33363;}


.ss-play-ss{ }
.ss-play-btn{width: 100%; height: 100%; position: absolute; top:0; filter:alpha(opacity=65); -moz-opacity:0.65;-khtml-opacity:0.65; opacity:0.65;}
.ss-play-btn2{width: calc(100% - 8px); position: absolute; top:30px; filter:alpha(opacity=65); -moz-opacity:0.65;-khtml-opacity:0.65; opacity:0.65;}

.ss-play-btn:hover, .ss-play-btn2:hover{ filter:alpha(opacity=1); -moz-opacity:1;-khtml-opacity:1; opacity:1; filter: contrast(140%);}

.ss-play-btn img, .ss-play-btn2 img{width: 100%;}

/* 700 ****************************************** */
@media screen and (max-width: 700px) {
h2{padding: 100px 0 0 0;}
h4{font-size: 4vw;}
h5{width: 98%; font-size: 4.4vw; padding: 1% 1% 1% 1%;}



h6{width: 97%; max-width: calc(1000px - 4%); margin: 3% auto 2% auto; padding: 0.5% 2%; background:#605d77; color:#fff; font-size: 18px;}
.sub-title{width: 100%; margin: 2% auto 0 auto; padding: 3% 0% 0 0%; font-size: 18px; font-weight: 600; border-bottom: solid 1px #605d77;}

.text-box{font-size: 3vw;}
.txt-box-full{font-size: 3vw;}
.ss-box-1type{width: 98%;}

.cont1-txt{width: 98%; padding: 1%; font-size: 3vw;}
.cont1-img{width: 98%; padding: 3% 1% 1% 1%; font-size: 3vw; margin-left:0;}

.ss-box-3type{width: 98%; padding: 2% 0;}
.ss-box-3type li{width: 95%; padding:2% 0.5% 0.5% 0.5%;}
.ss-at{font-size: 3vw;}
.ss-at2{font-size: 3.2vw;}

.txt-box-left1{width: 98%; padding: 1% 0 1% 0; font-size: 3vw; }
.txt-box-left1 p{width: 100%; display:block; margin: 0; padding-bottom: 0;}
.ss-box-right1{width: 98%;}


.txt-box-right1{width: 100%; padding: 1% 0 1% 0; font-size: 3vw; }
.txt-box-right1 p{width: 100%; display:block; margin: 0; padding-bottom: -2%;}
.ss-box-left1{width: 100%;}



.ss-box-2type{width: 98%; padding: 2% 0;}
.ss-box-2type li{width: 99%; padding:0.5%; margin-bottom:5%;}



.redline2{display:block; box-shadow:25px 22px 0px -14px #e33363;  -webkit-box-shadow:25px 22px 0px -14px #e33363; -moz-box-shadow:25px 22px 0px -14px #e33363;}


}



.system-item-list {
	display: -webkit-flex;
	display: flex;
	padding-top:3%;
}

.system-item-list dt {
	width: 100px;
}


.system-item-list dd {
	-webkit-flex: 1;
	flex: 1;
	padding:0 3% 1.5% 3%;
}





/* tooltip */
.noblock{ display: none;}
a.clicktooltip{ }
.tooltip{ margin: 0; padding: 5px; width: 70%; max-width: 300px; background-color:rgba(127,145,232,0.90);  color: #fff; min-height: 30px; top: 100px; left: 20px; position: absolute; text-shadow: none;}

a.clicktooltip{ background: url("../img/world/tips-icon.png") no-repeat right; padding-right: 17px; color: #ffff00;}
a.clicktooltip:visited { color: #ffff00; }
a.clicktooltip:hover {filter: contrast(140%); }
a.clicktooltip:active { color: #ffff00; }


@keyframes fade-inanime {
    0% {opacity: 0;}
    100% {opacity: 1;}
}