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

/*____________ common_____________

_______ font

font-family: "tbudgothic-std"; 400 700 900
font-family: "source-han-sans-japanese"; 400 700
font-family: "dnp-shuei-ymincho-std"; 500 600

z-index

#gMenuBurger:950
.overlay:900
.header: 800


____________ common_____________*/

 /*全要素へbox-sizing */
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	

}



html, body {
    color: #99948E;
    background-color: #000;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    line-height: 0;  /*全ての要素にline-height設定*/
    font-family: "tbudgothic-std", "source-han-sans-japanese", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 11pt;
    font-weight: 400;
    /*height: 100%; 100%だとモーダルに影響 */
	
	/*font表示最適化 ON*/
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: auto;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    background-image: url(../img/base.jpg);
    background-repeat: repeat-y;
    background-size: 100% auto;
    text-shadow: 0px 0px;
    background-attachment: fixed;
}

/*画面ロック*/
body.lock{
pointer-events: none;　
}


a{
    text-decoration: none;
    color: #A0937F;
}

a:hover{
    color: #C6B498;
}

p {
margin:0 0 1em 0;
}



.mb-1em{ margin-bottom: 1em;}
.mb-2em{ margin-bottom: 2em;}
.mb-3em{ margin-bottom: 3em;}
.mb-4em{ margin-bottom: 4em;}

.pb-1em{ padding-bottom: 1em;}
.pb-2em{ padding-bottom: 2em;}
.pb-3em{ padding-bottom: 3em;}
.pb-4em{ padding-bottom: 4em;}

.pc{ display: none;}
.sp{ display: block;}

.img100 img{ width:100%;}


.loadingicon{
	position: fixed;
	width: 200px;
	height:137px;
	margin-top: -70px;
	margin-left: -100px;
	top: 50%;
	left: 50%;
	z-index: 999;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	opacity: 1;
	display: none;
}


.fadeOut {
      opacity: 0;
      }
	  
.fadeIn {
      opacity: 1; 
      }



@media screen and (min-width: 768px) {
.pc{display: block;}
.sp{display: none;} 
	 }
	
	
	
	 
/*___________________________ sns*/	 
	 .snsTopNav {
	 margin:0 auto;
/*	display:flex;
justify-content: center;*/
margin:1em 0;
}
  .snsTopNav ul {
    display: table;
	  	margin: 0 auto 0 auto;
		padding:0;
}
    .snsTopNav ul li {
	display: table-cell;
	height: 25px;
	vertical-align: middle;
	padding-right: 2px;
	padding-left: 2px;
	padding-bottom: 10px;
	line-height: 0;
}


.section-sns{
display:flex;
justify-content: center;
align-items: center;
padding:0.5em 0;
}

.sns{
margin:0 0.5em;
}

.sns img{
width:100%;
}

.company{
    width: 100%;
    text-align: center;
}

.section-sns2{
    max-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0em 0 2em 0;
    margin: auto;
}


.copyright{
    width: 100%;
    text-align: center;
    font-size: 70%;
    padding: 1rem;
    color: #565656;
	line-height: 1rem;
}




/*___________________________ modal*/

.overlay {
	display: none;
	position: fixed;
	top: -10px;
	left: 0;
	right: 0;
	bottom: -10px;
	background-color: hsla(224,65%,34%,0.9);
	overflow: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	z-index: 910;
}

.overlay-container {
	display: table;
	padding: 10px 0;
	width: 100%;
	height: 100%;
}
.overlay-inner {
	display: table-cell;
	padding: 2.7em 2em;
	vertical-align: middle;
	/*line-height: 1.6em;*/
}

.overlay-inner.full{
padding: 0;	
}




/*youtube*/
.youtube {
	position: relative;
	/* padding-bottom: 56.25%;
    padding-top: 30px;*/
	padding-bottom: 56.25%;
	padding-top: 0px;
	height: 0;
	overflow: hidden;
	margin-top: 0px;
	margin-bottom: 0px;
	background-color: #FFFFFF;
}
.youtube iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	background-color: #FFFFFF;
}


/*@media screen and (min-width: 1281px) {
}*/

/*@media screen and (min-width: 1101px) {
}

@media screen and (min-width: 961px) {
}
*/