@charset "UTF-8";


/* ====================================================================================
+ kh3 main visual +
==================================================================================== */
.kh3-wrapper{
	width: 948px;
	border: 1px solid #dadcd9;
	background: #000000 url(../../img/camp/kh3/bg_kh3wrapper.png) 0 0 repeat-y;
	color: #ffffff;
}
.kh3-wrapper .link{
	color: #fffb82;
	text-decoration: underline;
	cursor: pointer;
}
.kh3-wrapper .main-visual{
	position: relative;
	min-height: 817px;
	padding: 540px 0 20px 0;
	background: #1c212f url(../../img/camp/kh3/bg_mainvisual.jpg) 0 0 no-repeat;
	text-align: center;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;x
}
.kh3-wrapper .main-visual p{
	text-align: center;
	font-size: 133.3%;
	line-height: 2.2;
}
.kh3-wrapper .main-visual .btn_mainvisual{
	display: block;
	margin: 24px auto 0 auto;
}
.kh3-wrapper .main-visual .logo-sns{
	position: absolute;
	right: 20px;
	top: 20px;
}
.kh3-wrapper .main-visual .logo-sns .btn-logo{
	display: block;
	position: absolute;
	width: 26px;
	height: 26px;
}
.kh3-wrapper .main-visual .logo-sns .logo-twitter{
	right: 0;
	top: 0;
	background: url(../../img/camp/kh3/logo_twitter.png) left top no-repeat;
}
.kh3-wrapper .main-visual .logo-sns .logo-facebook{
	right: 28px;
	top: 0;
	background: url(../../img/camp/kh3/logo_facebook.png) left top no-repeat;
}
/* / kh3 main visual
================================================================= */

.kh3-wrapper .term-wrapper{
	padding: .8em 0 .8em 0;
	text-align: center;
	background-color: #35405C;
	font-size: 166.6%;
	font-weight: normal;
}

/* ====================================================================================
+ kh3 lineup-wrapper +
==================================================================================== */
.kh3-wrapper .lineup-wrapper{
	padding: 0 0 16px 0;
}
.kh3-wrapper .lineup-wrapper .lineup-header{
	width: 100%;
	height: 170px;
	padding-top: 17px;
	text-align: center;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.kh3-wrapper .lineup-wrapper .lineup-title{
	margin: 0 45px;
	padding: 0 0 26px 0;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area{
	margin: 0 45px;
	display: flex;
	-webkit-justify-content: space-between;
	        justify-content: space-between;
	-webkit-flex-wrap: wrap;
	    -ms-flex-wrap: wrap;
	        flex-wrap: wrap;
	padding: 0 0 50px 0;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area.all{
	-webkit-justify-content: center;
	        justify-content: center;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area.all .lineup-box{
	margin: 0 5px;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area .lineup-box{
	width: 280px;
	background-color: #33363e;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area .lineup-box .thumbnail-area{
	width: 100%;
	height: 217px;
	text-align: center;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area .lineup-box .thumbnail-area .thumbnail{
	min-height: 100%;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area.rare .lineup-box .thumbnail-area{
}
.kh3-wrapper .lineup-wrapper .lineup-box-area .lineup-box .description-area{
	padding: 12px 10px 12px 10px;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area .lineup-box .description-area .title{
	font-weight: bold;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area .lineup-box .description-area .title .fz20{
	font-size: 20px;
	line-height: 1.5;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area .lineup-box .description-area .title .fz16{
	font-size: 16px;
	line-height: 1.5;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area .lineup-box .description-area .title .fz15{
	font-size: 15px;
	line-height: 1.5;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area .lineup-box .description-area .title .fz14{
	font-size: 14px;
	line-height: 1.5;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area .lineup-box .description-area .text{
	padding: .2em 0 1em 0;
	font-size: 12px;
	color: #a6adbf;
	line-height: 1.6;
	letter-spacing: 0.5px;
}
.kh3-wrapper .lineup-wrapper .lineup-box-area .lineup-box .description-area .price{
	padding: .2em 0 0 0;
	font-size: 10px;
	font-weight: bold;
	color: #ffffff;
	line-height: 1.4;
}
.kh3-wrapper .lineup-wrapper .commingsoon-area{
	margin: 0 45px;
	padding: 0 0 26px 0;
	text-align: center;
}
.kh3-wrapper .lineup-wrapper .commingsoon-area .text-white{
	padding: 1em 0 .8em 0;
	font-size: 166.6%;
	color: #FFF;
	font-weight: bold;
	text-align: center;
}
.kh3-wrapper .lineup-wrapper .commingsoon-area .text-red{
	padding: 0 0 .6em 0;
	font-size: 133.3%;
	color: #d90000;
	text-align: center;
}
/* / kh3 lineup-wrapper
================================================================= */


/* ====================================================================================
+ kh3 targetitem-wrapper +
==================================================================================== */
.kh3-wrapper .targetitem-wrapper{
	padding: 0 44px 30px 44px;
	background: #1b212f url(../../img/camp/kh3/bg_targetitem_wrapper.png) 0 0 repeat-y;
}
.kh3-wrapper .targetitem-wrapper .targetitem-header{
	width: 100%;
	height: 160px;
	padding-top: 10px;
	text-align: center;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.kh3-wrapper .targetitem-wrapper .title-targetitem{
	padding: 0 0 32px 0;
}
.kh3-wrapper .targetitem-wrapper .version-type-wrapper{
	display: flex;
	-webkit-flex-wrap: wrap;
	    -ms-flex-wrap: wrap;
	        flex-wrap: wrap;
	-webkit-justify-content: space-between;
	        justify-content: space-between;
}
.kh3-wrapper .targetitem-wrapper .version-type-wrapper .version-type-area{
	width: 410px;
	background-color: #0b0e16;
}
.kh3-wrapper .targetitem-wrapper .version-type-wrapper .version-type-area .title-version{
	padding: 24px 0 20px 0;
	text-align: center;
}
.kh3-wrapper .targetitem-wrapper .version-type-wrapper .version-type-area .content{
	padding: 0 30px 0 20px;
}
.kh3-wrapper .targetitem-wrapper .version-type-wrapper .version-type-area .content .list{
	padding: 0 0 1.6em 0;
	text-align: left;
	text-indent: -1em;
	margin-left: 1em;
	line-height: 1.6;
}
.kh3-wrapper .targetitem-wrapper .version-type-wrapper .version-type-area .content .text{
	padding: 0 0 1.6em 10px;
	text-align: left;
	line-height: 1.6;
}
.kh3-wrapper .targetitem-wrapper .version-type-wrapper .version-type-area .content .bold{
	font-weight: bold;
}
.kh3-wrapper .targetitem-wrapper .version-type-wrapper .version-type-area .content .image{
	padding: 0 0 2em 0;
	text-align: center;
}
/* / kh3 campitem-wrapper
 ================================================================= */


/* ====================================================================================
+ kh3 registinfo-wrapper +
==================================================================================== */
.kh3-wrapper .registinfo-wrapper{
	padding: 0 43px 30px 43px;
}
.kh3-wrapper .registinfo-wrapper .registinfo-header{
	width: 100%;
	height: 170px;
	padding-top: 30px;
	text-align: center;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.kh3-wrapper .registinfo-wrapper .step-wrapper{
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .step-area{
	padding: 30px 38px 10px 154px;
	min-height: 95px;
	background-color: #212839;
	background-repeat: no-repeat;
	background-position: 40px center;
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .step-area:nth-child(even){
	background-color: #2e364c;
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .step-area.step1{
	background-image: url(../../img/camp/kh3/icon_step1.png);
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .step-area.step2{
	background-image: url(../../img/camp/kh3/icon_step2.png);
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .step-area.step3{
	background-image: url(../../img/camp/kh3/icon_step3.png);
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .step-area.step4{
	background-image: url(../../img/camp/kh3/icon_step4.png);
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .step-area.step5{
	background-image: url(../../img/camp/kh3/icon_step5.png);
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .step-area.step6{
	background-image: url(../../img/camp/kh3/icon_step6.png);
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .step-area .content{
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .step-area .content .title-step-area{
	padding: 0 0 1em 0;
	font-size: 150%;
	font-weight: bold;
	text-align: left;
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .step-area .content .text-step-area{
	padding: 0 0 1.5em 0;
	text-align: left;
	line-height: 1.6;
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .appbutton-area{
	padding: 0 0 12px 0;
	text-align: left;
}
.kh3-wrapper .registinfo-wrapper .step-wrapper .appbutton-area .btn-app{
	display: inline-block;
	margin-right: 16px;
}
/*  / kh3 registinfo-wrapper
================================================================= */


/* ====================================================================================
+ kh3 status-wrapper +
==================================================================================== */
.kh3-wrapper .status-wrapper{
	height: 254px;
	display: flex;
	-webkit-justify-content: center;
	        justify-content: center;
	    -webkit-align-items: center;
	            align-items: center;
	-webkit-flex-direction: column;
	    -ms-flex-direction: column;
	        flex-direction: column;
}
.kh3-wrapper .status-wrapper .button-field{
	width: 100%;
	text-align: center;
}
.kh3-wrapper .status-wrapper .text-field{
	width: 100%;
	padding: 1.5em 0 0 0;
	text-align: center;
}
.kh3-wrapper .status-wrapper .text-field .text{
	line-height: 2em;
	text-align: center;
}
.kh3-wrapper .status-wrapper .text-appbutton{
	padding: 0 0 18px 0;
}
.kh3-wrapper .status-wrapper .appbutton-field .btn-app{
	display: inline-block;
	margin: 0 8px;
}
/* / kh3 status-wrapper
================================================================= */


/* ====================================================================================
+ kh3 attention-wrapper +
==================================================================================== */
.kh3-wrapper .attention-wrapper{
	padding: 30px 44px 40px 44px;
	background-color: #1b212f;
}
.kh3-wrapper .attention-wrapper .attention-header{
	padding: 0 0 30px 0;
}
.kh3-wrapper .attention-wrapper .attention-area{
	background-color: #0b0e16;
	padding: 22px 18px 12px 18px;
}
.kh3-wrapper .attention-wrapper .attention-area .list{
	margin-left: 1em;
	text-indent: -1em;
	color: #c5cce1;
	line-height: 1.6;
}
/* / kh3 attention-wrapper
================================================================= */


/* ====================================================================================
+ kh3 gameinfo-wrapper +
==================================================================================== */
.kh3-wrapper .gameinfo-wrapper{
	width: 100%;
	height: 632px;
	background: url(../../img/camp/kh3/bg_gameinfowrapper.jpg) 0 0 no-repeat;
	position: relative;
}
.kh3-wrapper .gameinfo-wrapper .btn-official{
	position: absolute;
	left: 40px;
	top: 425px;
}
.kh3-wrapper .gameinfo-wrapper .btn-estore{
	position: absolute;
	left: 40px;
	top: 503px;
}

/* / kh3 gameinfo-wrapper
================================================================= */


/* ====================================================================================
+ kh3 modal +
==================================================================================== */
.kh3-modal{
	padding:0 0 0 0;
	display:none;
}
.modaal-container{
	border: 10px solid #3b404b;
}
.modaal-content-container{
	width: 600px;
	background-color: #1c2231;
	border: none;
}
/*.modaal-content-container .ppwp{
	border: none;
	color: #ffffff;
}*/
.kh3-modal-inner{
	width:530px;
	min-height: 550px;
	margin:0 auto;
	padding:0 0 0 0;
	color: #ffffff;
}
.kh3-modal-inner .title-modal-ticket{
	text-align:center;
}
.kh3-modal-inner .text{
	margin:0 auto;
	text-align:left;
	color:#ffffff;
	line-height:1.5;
}
.kh3-modal-inner .color-yellow{
	color: #fffdc7;
}
.kh3-modal-inner .color-gray{
	color: #a6adbf;
}
.kh3-modal-inner .term-area{
	padding: 24px 0 0 0;
	text-align: center;
}
.kh3-modal-inner .term-area .term{
	text-align: center;
	font-size: 16px;
}
.kh3-modal-inner .term-area .note{
	padding-top: .3em;
	text-align: center;
}
.kh3-modal-inner .detail-area{
	padding: 30px 0 0 0;
	text-align: left;
}
.kh3-modal-inner .detail-area .title-detail{
	padding-bottom: .2em;
	text-align: left;
	font-size: 16px;
	font-weight: bold;
}
.kh3-modal-inner .detail-area .text-detail{
	text-align: left;
	color: #FFF;
	line-height: 1.5;
}

.kh3-modal-inner .attention-wrapper{
	padding: 30px 0 0 0;
}
.kh3-modal-inner .attention-wrapper .attention-header{
	padding: 0 0 10px 0;
	font-size: 16px;
	font-weight: bold;
}
.kh3-modal-inner .attention-wrapper .attention-area{
	padding: 0 0 1.2em 0;
}
.kh3-modal-inner .attention-wrapper .attention-area .list{
	margin-left: 1em;
	text-indent: -1em;
	color: #c5cce1;
	line-height: 1.6;
}
.kh3.pp_pic_holder .pp_bottom{
	padding: 0;
	background: #1c2231;
}

.modal-ticket-opened .modaal-close{
	width: auto;
	height: auto;
	display: inline-block;
	position: fixed;
	right: 50%;
	top: 50%;
	margin-right: -310px;
	margin-top: -346px;
	-webkit-border-radius: 0;
	        border-radius: 0;
	background: transparent;
	-webkit-transition: 0;
	   -moz-transition: 0;
	    -ms-transition: 0;
	     -o-transition: 0;
	        transition: 0;
	font-weight: bold;
	color: #fffb82;
}