@charset "utf-8";
/* CSS Document */


/* import style
------------------------------------------------------------------- */
@import url('/css/mod_default.css');
@import url('/css/mod_layout.css');
@import url('/css/mod_headerfooter.css');
@import url('/css/mod_common.css');
@import url('/css/mod_others.css');
@import url('/css/library/colorbox.css');
@import url('/css/library/animate.min.css');
@import url('/css/library/hover-min.css');


/* footer
---------------------------------------------------------------------- */

#footerArea {
	width: 830px;
	margin: 0 auto;
	background-image:none; background-color:#f6f6f6;
	-webkit-border-radius: 5px;  /* Safari,Google Chrome */
	-moz-border-radius: 5px;      /* Firefox12まで */
	border-radius: 5px;           /* Firefox13以降 */
	z-index: 100;
}

.btnList{ margin: 0 auto; }



/* ------------------------------------------- */
/*　1017 11周年ありがとうキャンペーン
------------------------------------------- */

/*全体-----------------------------------*/

#october2019_11thanv{
	position: relative;
	min-width: 1000px;
	margin: 0 auto;
	width: 100%;
	background: url("/image/event/october2019/special/bg_all.png") #26745f repeat center top;
	background-color: #c8f0fb;
	overflow: hidden;
}

/*　11周年飾り
------------------------------------------- */

#topImage{
	position: absolute;
	background: url("/image/event/october2019/special/img_topline.png") repeat-x center top;
	width: 100%;
	height: 24px;
	top: 0;
}

#leftSideImage{
	position: absolute;
	background: url("/image/event/october2019/special/img_leftSide.png") no-repeat left top;
	width: 163px;
	height: 159px;
	top: 0;
	left: 0;
}

#rightSideImage{
	position: absolute;
	background: url("/image/event/october2019/special/img_rightSide.png") no-repeat right top;
	width: 147px;
	height: 156px;
	top: 0;
	right: 0;
}

#frontImage{
	position: absolute;
	background: url("/image/event/october2019/special/img_front.png") no-repeat center top;
	width: 100%;
	height: 110px;
	top: 0;
}

#bottomImage{
	position: absolute;
	background: url("/image/event/october2019/special/img_topline.png") repeat-x center bottom;
	width: 100%;
	height: 24px;
	bottom: 0;
}


/*　
------------------------------------------- */
.head_wrap{
	height: 565px;
	background-image:
		url("/image/event/october2019/special/curtain.png"),
		url("/image/event/october2019/special/bg_notice.png");
	background-repeat:
		repeat-x,
		repeat;
	background-position:
		top center,
		top center;
}

.head_wrap h1{
	background: url("/image/event/october2019/special/frcamp_title.png") no-repeat center top;
	height: 565px;
}

.special191017{
	position: relative;
	width: 100%;
	min-width: 1000px;
	margin: -55px auto 0;
	overflow: hidden;
}

.special191017_wrap{
	background: url("/image/event/october2019/special/bg_wrap.png") repeat-x 0 23px;
}

.special191017-Box, .special191017-Box_Notice {
	position: relative;
	width: 890px;
	height: 100%;
	margin: 16px auto 0 ;
}

.special191017 h1,.special191017 h2,.special191017 h3,.txt_present{
	height: 0;
	overflow: hidden;
	text-indent:100%;
	white-space:nowrap;
	box-sizing: border-box;
}

.present1{background: url("/image/event/october2019/special/tit_present1.png") no-repeat 0 0;}
.present2{background: url("/image/event/october2019/special/tit_present2.png") no-repeat 0 0;}
.present3{background: url("/image/event/october2019/special/tit_present3.png") no-repeat 0 0;}

.present1 .txt_present{
	background: url("/image/event/october2019/special/present1_bg01.png") no-repeat 10px 95px;
	height: 790px;
}
.present2 .txt_present{
	background: url("/image/event/october2019/special/present2_bg01.png") no-repeat 40px 95px;
	height: 570px;
}
.present3 .txt_present{
	background: url("/image/event/october2019/special/present3_bg01.png") no-repeat 40px 95px;
	height: 335px;
}

.howto{
	background: url("/image/event/october2019/special/present3_bg02.png") no-repeat 5px 0;
	height: 320px;
    padding-top: 185px;
    padding-left: 23px;
	box-sizing: border-box;
	position: relative;
}

.howto p{
	position: absolute;
	top: 86px;
    left: 142px;
	color: #333;
}

.howto p span{
	font-weight: bold;
}

.howto #widget{
	position: absolute;
    top: 126px;
    left: 155px;
}

.howto #widget .btn-o{
	width: 98px;
	height: 30px;
	border: 2px solid #f58ea8;
	border-radius: 15px;
	background: #fff;
	box-sizing: border-box;
	transition: 0.6s;
}

.howto #widget .btn-o:hover{
	background: #f58ea8;
}

.howto #widget a{
	display: block;
	width: 100%;
	height: 100%;
	color: #f58ea8;
	padding-left: 10px;
	padding-top: 4px;
	box-sizing: border-box;
}

.howto #widget a:hover{
	text-decoration: none;
	color: #fff;
	opacity: 1;
}

.howto li{
	display: inline-block;
	width: 254px;
    padding: 0px 10px;
	margin-right: 10px;
	vertical-align: middle;
	color: #333;
}

.howto li span{
	font-weight: bold;
}

.howto li:last-child{
	width: 170px;
	margin-right: 0;
    padding-left: 63px;
}

.special191017-Box_Tweet{
	position: relative;
	padding: 95px 0 50px;
	background: url("/image/event/october2019/special/frcamp_bg04.png") no-repeat center top;
}

.special191017-Box_TweetBox{
	margin: 0 auto;
	border: 4px solid #bbce9c;
	border-radius: 10px;
	background: #fff;
	width: 500px;
	padding: 4px;
}

.special191017-Box_TweetBox .twitter-tweet{
	margin: 0!important;
}

.btn_friend {
	position: absolute;
	left: 0;
	bottom: 25px;
	width: 175px;
	height: 227px;
}

a.fly{
	width: 175px;
	height: 227px;
	display: inline-block;	
	transition: 0.6s;
}

a.fly img{
	width: 175px;
	height: 227px;
	max-width: none;
}

a.fly:hover{
	transform: translateY(-16px);
}

.notice_wrap{
	padding: 90px 0;
	background-image:
		url("/image/event/october2019/special/img_notice.png"),
		url("/image/event/october2019/special/bg_notice.png");
	background-repeat:
		repeat-x,
		repeat;
	background-position:
		top center;
}

.special191017-Box_Notice{
	background: url("/image/event/october2019/special/frcamp_bg05.png") no-repeat center top;
    height: 397px;
    padding-top: 63px;
    padding-left: 60px;
    box-sizing: border-box;
}

.special191017-Box_Notice ul {
	padding: 30px 0 10px 20px;
}
.special191017-Box_Notice ul.cyui_1 {
	background: url("/image/event/october2019/special/cyui_1.png") no-repeat 0 0;
}

.special191017-Box_Notice ul.cyui_2 {
	background: url("/image/event/october2019/special/cyui_2.png") no-repeat 0 0;
}

.special191017-Box_Notice ul.cyui_3 {
	background: url("/image/event/october2019/special/cyui_3.png") no-repeat 0 0;
}

.special191017-Box_Notice li{
	position: relative;
    width: 680px;
	padding: 0 0 4px 0;
}

.special191017-Box_Notice li::before{
	content: "※";
	position: absolute;
	top: 0;
	left: -14px;
}

.special191017-Box_Notice li a{
	color: #a19553;
    text-decoration: underline;
	padding: 0 4px;
}

.special191017-Box_Notice li a:hover{
	opacity: 0.6;
}


/*　
------------------------------------------- */
#october2019_11thanv .pageTop{
	position: relative;
    width: 100%;
    max-width: 950px;
    height: 0;
    margin: 0 auto;
	z-index: 999;
}
	
#october2019_11thanv .pageTop a{
	left: auto;
	display: block;	
	margin-left: 920px;
	margin-top: 0;
	padding:1em 0 0 2px;
	transition: 0.6s;
}


#october2019_11thanv .pageTop img{
	width: 87px;
	height: 101px;
	max-width: none;
}

#october2019_11thanv .pageTop a:hover{
	transform: translateY(-16px);
}

/*ボタン*/
.btn_gachaGet {
	position: absolute;
	top: 315px;
	left: 260px;
	width: 374px;
	height: 60px;
}
.bnr_gachashop a {
    display: block;
    position: absolute;
    top: 501px;
    left: 63px;
    width: 774px;
    height: 200px;
    overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	box-sizing: border-box;
}
.btn_gachashop {
	position: absolute;
	top: 717px;
	left: 190px;
	width: 527px;
	height: 38px;
}