@charset "utf-8";

/* utility ---------------------------------------------------------------------*/
.m05 { margin-bottom:5px;}
.m10 { margin-bottom:10px;}
.m12 { margin-bottom:12px;}
.m15 { margin-bottom:15px;}
.m20 { margin-bottom:20px;}
.m30 { margin-bottom:30px;}
.m40 { margin-bottom:40px;}
.m50 { margin-bottom:50px;}
.m60 { margin-bottom:60px;}
.m70 { margin-bottom:70px;}
.mt05 { margin-top:5px;}
.mt10 { margin-top:10px;}
.mt12 { margin-top:12px;}
.mt15 { margin-top:15px;}
.mt20 { margin-top:20px;}
.mt30 { margin-top:30px;}
.mt40 { margin-top:40px;}
.mt50 { margin-top:50px;}
.mt60 { margin-top:60px;}
.mt70 { margin-top:70px;}
.mt80 { margin-top:80px;}
.mb05 { margin-bottom:5px;}
.mb10 { margin-bottom:10px;}
.mb12 { margin-bottom:12px;}
.mb15 { margin-bottom:15px;}
.mb20 { margin-bottom:20px;}
.mb30 { margin-bottom:30px;}
.mb40 { margin-bottom:40px;}
.mb50 { margin-bottom:50px;}
.mb60 { margin-bottom:60px;}
.mb70 { margin-bottom:70px;}
.mb100 { margin-bottom:100px;}
.ml05 { margin-left:5px;}
.ml05 { margin-left:5px;}
.ml10 { margin-left:10px;}
.ml12 { margin-left:12px;}
.ml15 { margin-left:15px;}
.ml20 { margin-left:20px;}
.ml30 { margin-left:30px;}
.ml40 { margin-left:40px;}
.ml50 { margin-left:50px;}
.ml60 { margin-left:60px;}
.ml70 { margin-left:70px;}
.mr05 { margin-right:5px;}
.mr10 { margin-right:10px;}
.mr15 { margin-right:15px;}
.mr20 { margin-right:20px;}
.mr25 { margin-right:25px;}
.mr30 { margin-right:30px;}
.mr40 { margin-right:40px;}
.mr50 { margin-right:50px;}
.mr60 { margin-right:60px;}
.mr70 { margin-right:70px;}
.pt05 { padding-top:5px;}
.pt10 { padding-top:10px;}
.pt15 { padding-top:15px;}
.pt20 { padding-top:20px;}
.pt25 { padding-top:25px;}
.pt30 { padding-top:30px;}
.pt40 { padding-top:40px;}
.pt50 { padding-top:50px;}
.pt60 { padding-top:60px;}
.pt70 { padding-top:70px;}
.pb05 { padding-bottom:5px;}
.pb10 { padding-bottom:10px;}
.pb15 { padding-bottom:15px;}
.pb20 { padding-bottom:20px;}
.pb30 { padding-bottom:30px;}
.pb40 { padding-bottom:40px;}
.pl05 { padding-left:5px;}
.pl10 { padding-left:10px;}
.pl15 { padding-left:15px;}
.pl20 { padding-left:20px;}
.pl25 { padding-left:25px;}
.pl30 { padding-left:30px;}
.pl40 { padding-left:40px;}
.pl50 { padding-left:50px;}
.pl60 { padding-left:60px;}
.pl70 { padding-left:70px;}
.pl90 { padding-left:90px;}
.pr05 { padding-right:5px;}
.pr10 { padding-right:10px;}
.pr15 { padding-right:15px;}
.pr20 { padding-right:20px;}
.pr25 { padding-right:25px;}
.pr30 { padding-right:30px;}
.pr40 { padding-right:40px;}
.pr50 { padding-right:50px;}
.pr60 { padding-right:60px;}

.f_left { float:left; }
.f_ringt { float:right; }

.clear {clear:both;}
.clearfix:before, .clearfix:after { content: ""; display: block; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


.pcNone { display: none; }



/* font
-------------------------------------------------------------- */

@font-face {
font-family: "Nexa-Bold";
src: url("../font/Nexa-Bold.eot"); 
src: url("../font/Nexa-Bold.eot?#iefix") format("embedded-opentype"), 
url("../font/Nexa-Bold.woff") format("woff"), 
url("../font/Nexa-Bold.ttf") format("truetype"),
url("../font/Nexa-Bold.svg#svgssmfont") format("svg");
	}

/* 追加reset */
html,body,div {
	margin: 0;
	}

body { 
	-webkit-text-size-adjust: 100%;
	background-color: #ffffff;
	color: #000000;
	}

div { overflow: hidden; }

ul{ 
	list-style-type: none;
	padding-inline-start: 0;
	}

body,div,p,li{
	margin: 0 0;
	text-align: left;
	font-family: toppan-bunkyu-midashi-go-std, sans-serif;
	font-weight: 900;
	font-style: normal;
	letter-spacing: 0.4px;
	}
h1,h2,h3,strong,dt,b{
	letter-spacing: 0.07em;
	}
span{
	letter-spacing: 0.7px;
	}
pre{
	font-family: toppan-bunkyu-midashi-go-std, sans-serif;
	letter-spacing: 0;
	}
table,input,code{
	font-family: toppan-bunkyu-midashi-go-std, sans-serif;
	}

a { color: #000000; }
a:link { color: #000000; }
a:visited { color: #000000; }
a:hover { color: #000000; }
a:active { color: #000000; }

.ls-1 { //アポストロフィー対応
	letter-spacing: -0.1em;
	}




/* common
-------------------------------------------------------------- */

#wrapper {
	width: 100%;
	min-height: 100%;
	position: relative;
	padding-bottom: 220px; /*←footerの高さ*/
    box-sizing: border-box; /*←全て含めてmin-height:100vhに*/
    display: block;
	}

section{
	width: 100%;
	}

.sectionIn {
	width: 100%;
	margin: 50px auto 50px auto;
	overflow: hidden;
	}

article {
	text-align: center;
	margin-top: 50px;
	}

h1 {
	text-align: center;
	font-size: 14vw;
	}

/* セクション間縦線 */
.v_line_fix {
	width: 50%;
	height: 220px;
	border-right: dotted;
	border-width: 8px;
	border-color: black;
	margin: 100px 0;
	}

.more {
	font-size: 38px;
	text-align: center;
	padding-top: 70px;
	}

/* タブレット */
@media print, screen and (min-width: 600px) {

h1 {
	font-size: 12vw;
	}
}

/* PC */
@media print, screen and (min-width: 960px) {

#wrapper {
	min-width: 980px;
	}

.sectionIn {
	min-width: 980px;
	}

article {
	margin-top: 70px;
	}

h1 {
	font-size: 5vw;
	}


}



/* 改行制御 スマホ
-------------------------------------------------------------- */

@media screen and (max-width: 959px){

/* PCの時改行 */
.br-pc { display: none; }

}
@media screen and (min-width: 960px){

/* PCの時改行しない */
.br-sp { display: none; }

}



/* loader
-------------------------------------------------------------- */

#loader-bg {
    width: 100vw;
    height: 100vh;
    background: #ffffff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
	}

#loading_barWrap {
    width: 100%;
    height: calc(1rem + 30px);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
	}

#loading_bar {
    width: 0;
    height: 10px;
    background: #999999;
    transition-duration: 1s;
	}

.text {
    text-align: right;
    color: #999999;
    margin-right: 10px;
    margin-bottom: 10px;
	}

.loadingNone {
    animation: loadingAnime 1s forwards;
	}

@keyframes loadingAnime {
    0% {
        opacity: 1;
    	}
    99% {
        opacity: 0;
    	}
    100% {
        opacity: 0;
        display: none;
    	}
	}

/* IE9 - IE11 */
@media screen and (min-width: 0\0) and (min-resolution: +72dpi) {

#loading_barWrap {
    height: calc(1rem + 20px);
	}

}



/* header
-------------------------------------------------------------- */

header {
    width: 100%;
    margin: 20px 0 60px 0;
	}

header h1,
header h2 {
    width: 93%;
    }

header h1 {
    margin-left: 20px;
	font-size: 10.4vw;
	text-align: left;
	line-height: 1em;
	}

header h2{
    margin-left: 20px;
	text-align: left;
	line-height: 1.2em;
	font-size: 3.2vw;
	}

header h1 a:hover {
	text-decoration: none;
    }

/* PC以外 */
@media print, screen and (max-width: 959px) {

header h1,
header h2 {
    width: 90%;
    }

header h1 {
    position: relative;
	font-size: 15.5vw;
	}

header h2{
    position: absolute;
    top: 1.2%;
    left: 41%;
	font-size: 3.1vw;
	line-height: 1.5em;
	}

header h2.tJus{
	text-align: left;
	text-align-last: left;
	text-justify: none;
	}

header .sph2l1{
	font-size: 4vw;
	}
}


/* navigation
-------------------------------------------------------------- */

nav{
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    padding-top: 50px;
    background: #1f1e1e;
    font-size: 16px;
    box-sizing: border-box;
    z-index: 100;
    color: #ffffff;
	}

.navBox {
	width: 100%;
	}

.navBox .navBoxInner{
	width: 80%;
	//border-top: 1px solid #cccccc;
	margin: 0 auto;
	}

.navBox .navLeft{
	//float: left;
	//width: 50%;
	}

.navBox .navLeft h1{
	margin-left: 0;
	}

.navBox .navLeft h1 a:hover{
	text-decoration: none;
	}

.navBox .navRight{
	//float: left;
	//width: 50%;
	border-top: 1px solid #cccccc;
	}

.navBox h1{
	font-size: 8.5vw;
	line-height: 1em;
	text-align: left;
	}

.navBox .mail{
	font-size: 4vw;
	margin: 40px 0 0 0;
	}

nav .menu{
	width: 100%;
	font-size: 5.5vw;
	border-bottom: 1px solid #ffffff;
	margin: 15px 0;
	padding-bottom: 20px;
	}

nav .menu li{
    display:block;
    padding: 5px 0 5px 5px;
	}

nav ul.menu li.current a{
	text-decoration: underline;
	}

nav ul.menu .perform li{
	font-size: 4vw;
	font-weight: 500;
    padding: 5px 0 5px 55px;
	
	}
nav ul.menu .perform li:before{
	content:">";
	width: 0.8em;
	height: 0.8em;
	}

nav .sns{
	width: 100%;
	margin: 40px 0 0 0;
	}

nav .sns .snsImg{
	width: 40px;
	padding-right: 30px;
	vertical-align: middle
	}

nav a { color: #ffffff; }
nav a:link { color: #ffffff; }
nav a:visited { color: #ffffff; }
nav a:hover { color: #ffffff; }
nav a:active { color: #ffffff; }

.btn-gnavi {
    position: fixed;
    top: 20px;
    right: 20px;
    width: 30px;
    height: 24px;
    z-index: 101;
    box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: all 400ms;
    transition: all 400ms;
	}

.btn-gnavi span {
    position: absolute;
    width: 30px;
    height: 4px;
    background: #666;
    border-radius: 10px;
    -webkit-transition: all 400ms;
    transition: all 400ms;
	}
 
.btn-gnavi span:nth-child(1) {
    top: 0;
	}
 
.btn-gnavi span:nth-child(2) {
    top: 10px;
	}
 
.btn-gnavi span:nth-child(3) {
    top: 20px;
	}
 
.btn-gnavi.open {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
	}
 
.btn-gnavi.open span {
    background: #ffffff;
	}
 
.btn-gnavi.open span {
    width: 24px;
	}

.contents section p {
    position: absolute;
    top: 50%;
    width: 30%;
    line-height: 1.4;
    font-size: 20px;
    color: #fff;
    text-shadow: 0 0 6px #666
	}
 
.contents section:nth-child(odd) p {
    left: 10%
	}
 
.contents section:nth-child(even) p {
    right: 10%
	}

/* PC */
@media print, screen and (min-width: 960px) {

.navBox {
	width: 100%;
	margin-top: 50px;
	}

.navBox .navBoxInner{
	width: 60%;
	border-top: 1px solid #cccccc;
	}

.navBox .navLeft{
	float: left;
	width: 50%;
	}

.navBox .navRight{
	float: left;
	width: 50%;
	border-top: none;
	}

.navBox h1{
	font-size: 55px;
	line-height: 1em;
	text-align: left;
	}

nav .menu{
	font-size: 30px;
	}

nav ul.menu .perform li{
	font-size: 25px;
	
	}

nav .sns .snsImg{
	width: 50px;
	padding-right: 30px;
	}

.navBox .mail{
	font-size: 20px;
	margin: 50px 0 0 0;
	}

}/* PC end */


/* h1高さ対応 */
.mac.chrome header .h1_bg h1{
	padding-top: 20px;
	}
.mac.gecko header .h1_bg h1{
	padding-top: 21px;
	}
.mac.safari header .h1_bg h1{
	padding-top: 20px;
	}
.win.gecko header .h1_bg h1{
	padding-top: 15px;
	}
.iphone.safari header .h1_bg h1{
	padding-top: 5px;
	}



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

footer{
	position: absolute;/*←絶対位置*/
	bottom: 0;
	width: 100%;
	color: #000000;
	text-align: center;
	padding: 30px 0;
	}

footer p{
	font-size: 3vw;
	text-align: center;
	}

/* PC */
@media print, screen and (min-width: 960px) {

footer{
	width: 100%;
	padding: 80px 0;
	}

footer p{
	font-size: 1.5vw;
	}
	
}