@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');


/* body
---------------------------------------------------------------------- */
body{
	color: #333;
	font-family: 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', sans-serif;
	font-size: 12px;
	line-height: 1.5;
	margin: 0;
	padding: 0;
	font-weight: normal;
}

/* 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以降 */
}

.btnList{ margin: 0 auto; }



/* ------------------------------------------- */
/*　0913　9周年飾り
------------------------------------------- */
#townWrapper181128 div[id^="flag"]{
	position: absolute;
	top: 0;
	width: 50%;
	max-width: 516px;
	height: 293px;
}

#townWrapper181128 #flag_r{
	right: 0;
	background: url(/image/event/november2018/10aniversary/flag_r.png) no-repeat right top;
	background-size: contain;
	z-index: 10;
}

#townWrapper181128 #flag_l{
	left: 0;
	background: url(/image/event/november2018/10aniversary/flag_l.png) no-repeat left top;
	background-size: contain;	
	z-index: 10;
}

#townWrapper181128 #angel{
	background: url(/image/event/november2018/10aniversary/img_angels.png) no-repeat center top;
	position: absolute;
	top: 7px;
	width: 100%;
	height: 159px;
	z-index: 100;
    animation:
	moveYan 2.4s ease-in-out infinite alternate;
}

@keyframes moveYan {
	0% {transform: translateY(24px);}	
	100% {transform: translateY(0);}
}

/*全体-----------------------------------*/



#townWrapper181128{
	position: relative;
	min-width: 1000px;
	margin: 0 auto;
	width: 100%;
	background: url(/image/event/november2018/10aniversary/bg.png)repeat ;
	padding: 30px 0;
}

#townWrapper181128 #townWrapper181128_box1{
	position: relative;
	width: 1000px;
	margin: 60px auto 0;
	background: url(/image/event/november2018/10aniversary/img_corner.png) no-repeat center top #fffcf8;
	border: solid 3px #d1b387;
	border-radius: 8px;
	box-shadow:0px 0px 20px 2px #d1b387 inset;
}

#townWrapper181128 #townWrapper181128_box1::after{
	content: "";
	position: absolute;
	display: block;
	width: 1000px;
	height: 83px;
	background: url(/image/event/november2018/10aniversary/img_corner_b.png) no-repeat center bottom;
	bottom: -1px;
	border-radius: 4px;
}

#townWrapper181128 #townWrapper181128_box1::before{
	content: "";
	position: absolute;
	display: block;
	width: 1000px;
	height: 48px;
	background: url(/image/event/november2018/10aniversary/img_corner_t.png) no-repeat center bottom;
	top: -51px;
}




#townWrapper181128  #presentHeader-outer{	
	position:relative;
	width: 100%;
	height:280px;
	margin:0 auto;
	background: url(/image/event/november2018/10aniversary/bg_title.png) no-repeat center 0;
	z-index: 10;
}

#townWrapper181128  #presentHeader-outer h2.eventTit{
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	margin:0 auto ;
	zoom :1;
}





/*10周年のプレゼント
-----------------------------------*/


#townWrapper181128.present {
	padding: 136px 0 30px;
}
#townWrapper181128.present #townWrapper181128_box1{
	margin: -60px auto 0;
}



#townWrapper181128  #presentHeader-outer{	
	position:relative;
	width: 100%;
	height:65px;
	margin:0 auto;
	z-index: 10;
}

#townWrapper181128  #presentHeader-outer h2.eventTit{
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	margin:0 auto ;
	zoom :1;
}

#townWrapper181128 .presentArea01{
	position: relative;
	background: url(/image/event/november2018/10aniversary/10th_main.png) no-repeat center 20px;
	width: 1000px;
	height: 770px;
	margin: 0 auto;
}

#townWrapper181128 .presentArea01 .btn{
	position: absolute;
	top: 656px;
	left: 340px;
	width: 320px;
	height: 68px;
}

#townWrapper181128 .presentArea02{
	position: relative;
	background: url(/image/event/november2018/10aniversary/9th_notice.png) no-repeat center top;
	width: 1000px;
	height: 230px;
	margin: 0 auto;
}

#townWrapper181128 .presentArea02 p{
	position:absolute;
	top:60px;
	left:140px;
	font-size:12px;
	color:#777;
	line-height:1.8;
	letter-spacing: 0.5px;
	font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}


/* -------モーダル-------------------*/

.modal-overlay {
    z-index:200;
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
	height:100%;/*for old Safari*/
    height:100vh;
    background-color:rgba(0,0,0,.5)
}

.modal-overlay (:target) {height:100%\9} /* IE9,10 */

a.modal-open:hover {cursor:pointer; }

.modal-content {
    position:fixed;
    display:none;
    z-index:999;
    margin:2%;
}

.modal-content img {width:auto;max-height:100vh;}
.modal-content h1 {font-size:120%; margin-bottom:0.5em}
.modal-content p {max-width:565px; text-align:left;}

a.modal-close {
	position:absolute;
	top:-23px;
	right:-23px;
	height: auto;
}

a.modal-close img{
	width: 46px;
	height: auto;
}

a.modal-close:hover {
	cursor:pointer;
	opacity:1.0;
}

.modal-img{
	width: 100%;
	height: auto;
}

a.modal-banner {
width: 100%;
}

a.modal-banner img{
	position: absolute;
	width: 509px;
	height: 76px;
	left: 27px;
	top: 333px;
}
 

