@charset "UTF-8";
/*===================================================== */
/* html tags
======================================================= */
body{
	
}
/*===================================================== */
/* LAYOUT
======================================================= */
#catchcopy{
	padding:1rem;
	font-size: 0.9rem;
	color: #fff;
	text-align: center;
}
#wrapper{
	width:100%;
	margin:auto;
	padding:0;
	box-sizing: border-box;
	background-image:none !important;
}
#container{
	display: block !important;
	width:100%;
	margin:auto;
	box-sizing: border-box;
}

/*INDEX専用CSS*/

#index{
	width:100%;
	margin:0 auto;
	box-sizing: border-box;
}
.contents{
	padding:0;
}


/* 
   ####################################################################
   ####################################################################
   ####################################################################
*/
#index #mainArea{
	width:1000px;
	margin:0px auto 20px;
	padding: 0;
	/*background:url(../images/index/main.jpg) repeat-x top center ;*/
}

#index #mainArea > .inner{
	position:relative;
	width:100%;
	margin:auto;
}

#index #mainArea #main{
	margin:0px auto 2.3rem;
}
#index #mainArea #main img{
	box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.05);
}

/*　enter area　　*/
#index  #btnArea{
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	width:550px;
	margin:0 auto 3rem;
	z-index: 90;
}

#index #btnArea .enter{
	margin: auto;
}
#index #btnArea .exit{
	margin: auto;
}
#index #btnArea .text{
	color: #fff;
	text-align: center;
	font-size: 0.8rem;
}

#index #btnArea .enter a,
#index #btnArea .exit a{
	display: block;
	width: 150px;
	height: 150px;
	line-height: 150px;
	border-radius: 50%;
	color: #fff;
	text-align: center;	
	background-color: #333;

}
#index #btnArea .enter a:hover,
#index #btnArea .exit a:hover{
	background-color: #666;

}

#index #btnArea img{
}

/*  contentsArea
======================================================================*/

#contentsArea{
	position:relative;
	width:1140px;
	margin:auto;
}


/*注意事項*/
#contentsArea #caution{
	width:480px;
	margin:0 auto 40px;
	padding:20px;
	border:1px solid #caba78 ;
	background:url(../images/index/18kin.png) no-repeat 10px 10px rgba(25,25,25,0.8);
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}

#contentsArea #caution .inner{
	height:50px;
	padding:0 0 0 80px;
	text-align:left;
	font-size:11px;
	line-height:1.6;
	color:#afafaf;
}
#contentsArea #caution .inner a{
	color: #FFF;
}

/* banner */

/* banner */

#contentsArea #bannerArea{
	width:100%;
	margin: 0 0 25px;
	text-align: center;
}
#contentsArea #bannerArea .recruit{
	width:860px;
	margin:auto;
}

/**/

#index .wrap{
	width:96%;
	margin:0 auto 25px;
}
/*  introduce
======================================================================*/
#index #introduce{
	width:1100px;
	margin:0 auto 25px;
	text-align: center;
}
#index #introduce h2{
	margin: 0 0 0px;
	padding:0;
	text-align: left;
}
#index #introduce p{
	margin:0 0 0;
	padding:10px;
	font-size: 0.8rem;
	line-height: 2;
	color:#c0c0c0;
}
/*  mobile
======================================================================*/
#index #mobile{
	position:relative;
	float:right;
	width:420px;
	height:224px;
	text-align: left;
	background:url(../images/index/mobile_bg.jpg?ver=20200514) no-repeat;
}
#index #mobile h2{
	text-align: left;
}
#index #mobile .text{
	float: left;
	width:55%;
	text-align: left;
	font-size: 12px;
}
#index #mobile .QRcode{
	position: absolute;
	left:12px;
	top:12px;
}
#index #mobile .url{
	position: absolute;
	left:12px;
	bottom:15px;
	width:93%;
	padding:3px 10px;
	border: 1px solid #444;
	box-sizing: border-box;
	background:rgba(0,0,0,0.7);
	border-radius:5px;
	font-size:12px;
	color: #fff;
}

/* フォトダイアリー
======================================================= */
#index #shameArea{
	margin: 0 0 25px;
	
}
#index #shameArea ul{
	width:80%;
	margin: auto;
	border: 1px solid #eee
}
#index #shameArea li{
	float: left;
	position:relative;
	width:220px;
	height:434px;
	margin: 0 45px;
}
#index #shameArea .inner{
	position:absolute;
	top:78px;
	left:20px;
	width:180px;
	height: 288px;
	margin: auto;
	overflow: auto;
  	-webkit-overflow-scrolling:touch;
}
#index #shameArea li iframe{
	border: none;
	
	
  display:block; /* 追加で指定 */
	width:98%;
	height:100% !important;
	margin:auto;
	overflow: auto;
}

#index #shameArea li.shame1{
	background:url(../images/index/shame/bg1.png?ver=20200514) no-repeat;
}
#index #shameArea li.shame2{
	background:url(../images/index/shame/bg2.png?ver=20200514) no-repeat;
}
#index #shameArea li.shame3{
	background:url(../images/index/shame/bg3.png?ver=20200514) no-repeat;
}

/*  iframeArea
======================================================================*/
#index #iframeArea{}

#index #iframeArea ul{
	width:1130px;
	margin:0 auto 40px;
}

#index #iframeArea li{
	float: left;
	display: block;
	width:250px;
	margin: 0 10px;
	padding:0;
	border: 1px solid #EB184D;
}

#index #iframeArea li h3{
	display: block;
	margin: 0 0 0;
	background:#EB184D;
	color: #fff;
	padding:6px;
	text-align: center;
	box-sizing: border-box;
	font-weight: 100;
}
#index #iframeArea iframe{
	display: block;
	width:100%;
	height: 600px;
	margin: 0 ;
	border: none;
}



/* フォトダイアリー
======================================================= */
#index #shameArea{
	margin: 0 0 25px;
	
}
#index #shameArea ul{
	width:80%;
	margin: auto;
	border: 1px solid #eee
}
#index #shameArea li{
	float: left;
	position:relative;
	width:220px;
	height:434px;
	margin: 0 45px;
}
#index #shameArea .inner{
	position:absolute;
	top:78px;
	left:20px;
	width:180px;
	height: 288px;
	margin: auto;
	overflow: auto;
  	-webkit-overflow-scrolling:touch;
}
#index #shameArea li iframe{
	border: none;
	
	
  display:block; /* 追加で指定 */
	width:98%;
	height:100% !important;
	margin:auto;
	overflow: auto;
}

#index #shameArea li.shame1{
	background:url(../images/index/shame/bg1.png?ver=20200514) no-repeat;
}
#index #shameArea li.shame2{
	background:url(../images/index/shame/bg2.png?ver=20200514) no-repeat;
}
#index #shameArea li.shame3{
	background:url(../images/index/shame/bg3.png?ver=20200514) no-repeat;
}


/*  mobile
======================================================================*/
#index #index-diary{
	position:relative;
	width:1000px;
	margin: 0 auto 45px;
}
#index #index-diary li{
	float: left;
	width:21%;
	margin: 0 2% 15px;
}
#index #index-diary li iframe{
	border: none;
	display: block;
	height: 400px;
}

/*  NEW OPEN
======================================================================*/
#index .newopen{
	margin:  40px 0 ;
	text-align: center;
}

/*  グループリンク
======================================================================*/
#index #group_link{
	width:900px;
	margin:0 auto 25px;
}
#index #group_link ul{
	display: flex;
    flex-wrap: wrap;
	margin: auto;
}

#index #group_link ul li{
	display: inline-block;
	margin:0 19px 15px 0;
	padding:0;
}
#index #group_link ul li img{
	display: block;
}



/* 
   ####################################################################
   ####################################################################
   ####################################################################
*/

/* link */

#linkArea{
	width:980px;
	margin:0 auto 30px;
	color: #fff;
}
#linkArea h2{
	padding:0.5rem;
	text-align: center;
	border: 2px solid #fff;
	color: #fff;
	font-size: 0.85rem;
	font-weight: 100;
}
#linkArea a{
}
/**/
#linkArea #linkLarge{
	margin:0 0 20px;
}
#linkArea #linkLarge .box{
	float:left;
	height:70px;
	margin:0 20px 10px 0;
	font-size:11px;
	line-height:1.4;
}
#linkArea #linkLarge .box img{
	display:block;
	margin:0 0 3px;
}

/**/
#linkArea #linkSystem{
	margin:0 0 20px;
}
#linkArea #linkSystem .section{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	width:100%;
}
#linkArea #linkSystem .section .box{
	margin:0 0.5rem 1rem 0;
	border: none;
}
/* size */
#linkArea #linkSystem .section .box.link_size3{
	width:468px;
}
#linkArea #linkSystem .section .box.link_size2{
	width:200px;
}
#linkArea #linkSystem .section .box.link_size1{
	width:88px;
}
#linkArea #linkSystem .section .box.link_size0{
	width:auto;
}
#linkArea #linkSystem .section .box.link_size4{
	width:auto;
}

/**/
#linkArea #linkText{
	margin:0 0 20px;
}
#linkArea #linkText p{
	margin:0 0 10px 0;
	font-size:11px;
	line-height:1.4;
}
#linkArea #linkText p a{
	font-size:11px;
}

/*リンクバナーサイズ別*/
#linkArea table td,#linkArea table td img,#linkArea table td a{
	width:auto;
	height: auto;
	padding:0 !important;
	margin:0 !important;
	line-height: 1 !important;
}

/*===================================================== */
/* footer
======================================================= */


#footer{
	clear:both;
	width:100%;
	
	
	padding:20px 0;
	
	color: #f2f2f2;
}
#footer #footMenu{
	width:1200px;
	margin:0px auto 20px;
	padding: 15px 15px;

	
}

/* footerInfo */

/* footer navi */

#footer #footMenu #footer_naviArea{
	width:90%;
	margin:30px auto 40px ;
}
#footer #footMenu ul.footer_navi{
	text-align:left;
	margin:0 0 10px;
	
}

#footer #footMenu ul.footer_navi li{
	float:left;
	margin:0 30px 15px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;
	line-height:1.8;
	font-size:12px;
	color:#ccc;
	text-align:center;
	list-style-image:url(../images/common/footer/navi_icon.png?ver=20200514);
}
#footer #footMenu ul.footer_navi li a{
	color:#2e2e2e;
}
#footer #footMenu a:visited{
	text-decoration:none;
}
#footer #footMenu a:link{
	text-decoration:none;
}
#footer #footMenu a:hover{
	text-decoration:underline;
}
#footer #footMenu ul.footer_navi li ruby{
	display:block;
	font-size:11px;
	color:#ed1f59;
}

/* ###スペシャルリンク################################################# */
#footer #specialLink{
	float:right;
	padding:0 ;
}

/* ###コピーライト##################################################### */
#footer #copyright{
	text-align:center;
	padding:8px;
	font-size:11px;
}