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

/*
font-family: 'Playball', cursive;
font-family: 'Sawarabi Gothic', sans-serif;
*/

/***** common *****/
html { width: 100%; font-size:62.5%; font-weight:normal; }
body { width: 100%; font-size:1.0rem; font-family:'Sawarabi Gothic', -apple-system, BlinkMacSystemFont, sans-serif; color:#ffffff; background-color:#000; }
h1, h2, h3, h4, h5, .conTit p, dt, a, small  { font-family:'Sawarabi Gothic', sans-serif; font-weight:normal; margin:0px; padding:0px; }
a { color:#000000; display:inline-block; }
.cf:after { content:""; display:block; clear:both; }
#wrapper { overflow: hidden; }
.inner { max-width:960px; margin: 0 auto; }
.bottom_line { border-bottom:2px solid #B9B9B9; }

/***** index *****/
body#index { margin:0px; padding:0px; }

/*** navigation ***/

nav#spnav { width:100%; height:40px; position:fixed; background:linear-gradient(#B9B9B9, #F1F1F1); z-index:1001; }
.drawer{ display:flex; flex-direction:row; align-items:center; justify-content:space-between; position:relative; height:40px; padding:0 1em; float:right; }
.navbar_toggle{ z-index:9999; }
.navbar_toggle_icon { position:relative; display:block; height:2px; width:30px; background:#000000; -webkit-transition:ease .5s; transition:ease .5s; }
.navbar_toggle_icon:nth-child(1) { top: 0; }
.navbar_toggle_icon:nth-child(2) { margin: 8px 0; }
.navbar_toggle_icon:nth-child(3) { top: 0; }
/*OPEN時の動き*/
.navbar_toggle.open .navbar_toggle_icon:nth-child(1) { top:10px; -webkit-transform:rotate(45deg); transform:rotate(45deg); }
.navbar_toggle.open .navbar_toggle_icon:nth-child(2) { -webkit-transform:translateY(-50%); transform:translateY(-50%); opacity:0; }
.navbar_toggle.open .navbar_toggle_icon:nth-child(3) { top:-10px; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); }
.menu{ width:50%; -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition:ease .5s; transition:ease .5s; z-index:1000; }
.menu ul { background-color:#ffffff; }
.menu ul li{ padding: 2em; border-bottom: 1px solid #000000; }
.menu ul li a { display:block; width:100%; font-size:1.4rem; position:relative; }
.menu ul li a:after { content:'>'; display:block; position:absolute; right:0; top:0; }
/*OPEN時の動き*/
.menu.open { -webkit-transform:translateX(0); transform:translateX(0); overflow-y: auto; -webkit-overflow-scrolling: touch; }

#gnav h1 { height:60px; float:left; position:fixed; top:0; left:5%; margin:0px; }
#gnav h1 a { display:block; width:100%; height:100%; }
#gnav h1 a img { display:block; height:100%; }

/*** header ***/
#index header{ position:relative; width:100%; height:100vh; padding-top:30px; background:url(../images/header_bg.jpg); -moz-background-size:auto 100%; -webkit-background-size:auto 100%; -o-background-size:auto 100%; -ms-background-size:auto 100%; background-size:auto 100%; }
header div#copy { display:table-cell; width:100%; height:100vh; vertical-align:middle; padding:0 5%; }
header div#copy img { width:90%; }
header div#copy p.copy_txt { display:block; margin:40px 0 0 5%; font-size:1.3rem; line-height:2em; letter-spacing:0.2em; text-shadow: 1px 1px 1px #333333; }

/*** Contents ***/
div.con01 { padding:90px 0px; background:url(../images/bg_black.jpg) center top repeat fixed; border-bottom:2px solid #B9B9B9; }
div.contitle { text-align:center; }
div.contitle p { font-family: 'Playball', cursive; font-size:4rem; margin:0; }
div.contitle h2 { font-size:1.3rem; letter-spacing:0.5em; position:relative; margin:20px 0 70px; }
div.contitle h2:before { content:''; position:absolute; top:-15px; display:inline-block; width:60px; height:2px; left:50%; 
-moz-transform:translateX(-50%); -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); transform:translateX(-50%);
background-color:#B9B9B9; border-radius:1px;}
div.con01 div.imgarea { width:100%; height:30vh; overflow:hidden; margin-bottom:70px; }
div.con01 div.imgarea img { display:block; width:auto; height:100%; margin:0 auto; }
div.contents { width:90%; margin:0 auto; font-size:1.2rem; line-height:2.4rem; }

div.contents a.btn { display:block; width:100%; font-size:1.8rem; color:#999999; text-decoration:none; height:3.2rem; line-height:3.2rem; text-align:center; border:2px solid #B9B9B9; -webkit-border-radius:2.0rem; margin:20px auto 0; position:relative; }
div.contents a.btn:after { content:'>'; display:block; position:absolute; right:2.0rem; top:0; }

div.contents dl { width:100%; border-bottom:1px solid #ffffff; line-height:2.0rem; overflow:hidden; }
div.contents dl dt,div.contents dl dd { display:block; padding:0.5rem 0; border-top:1px solid #ffffff; }
div.contents dl dt { float:left; text-align:right; padding-right:5%; }

div#intro div.contents { text-align:center; }
div#intro div.contents h3 { font-size:1.5rem; letter-spacing:0.5rem; }
div#intro div.contents p { font-size:1.2rem; line-height:2.0rem; letter-spacing:0.2rem; }

div#intro div.contents ul { width:100%; border-bottom:2px solid #B9B9B9; margin-top:70px; }
div#intro div.contents ul li { width:100%; position:relative; padding:20px 0; border-top:2px solid #B9B9B9;  }
div#intro div.contents ul li a { display:block; color:#ffffff; }
div#intro div.contents ul li a img.phimg { width:50%; }
div#intro div.contents ul li a span { display:block; width:50%; float:right; }
div#intro div.contents ul li a span.egttl { font-family: 'Playball', cursive; font-size:3rem; height:2rem; line-height:3rem; margin:0; position:relative; }
div#intro div.contents ul li a span.jpttl { font-size:1.3rem; letter-spacing:0.5em; position:absolute; top:6.0rem; left:50%; }
div#intro div.contents ul li a span.jpttl:before { content:''; position:absolute; top:-0.8rem; display:inline-block; width:60px; height:2px; left:50%; 
-moz-transform:translateX(-50%); -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); transform:translateX(-50%);
background-color:#B9B9B9; border-radius:1px;}
div#intro div.contents ul li a span.dsc { line-height:1.4em; position:absolute; top:10rem; left:50%; }

div#news { background-image:none; }

div#news dl { width:90%; margin:0 auto; font-size:1.2rem; line-height:1.6em; }
div#news dl dt, div#news dl dd { display:block; }
div#news dl dt { text-align:right; float:left; width:25%; }
div#news dl dd { margin-left:30%; margin-top:10px; border-left:2px solid #B9B9B9; padding-left:5%; width:65%; }

div#business .description { text-align:center; font-size:1.4rem; line-height:2.8rem; }
div#business .item { margin-top:50px; }
div#business .item h3 { font-size:1.8rem; border-left:2px solid #B9B9B9; padding-left:0.5rem; margin-bottom:1.0rem; }

div#company div.contents dl dt { width:25%; }
div#company div.contents dl dd { width:70%; margin-left:30%; }

div#recruit div.contents dl dt { width:35%; }
div#recruit div.contents dl dd { width:60%; margin-left:40%; }

div#policy { background-image:none; background-color:#ffffff; color:#333333; }

/*** footer ***/
footer { width:100%; background:url(../images/bg_black.jpg) center top repeat fixed; padding-top:40px; }
footer div.con { width:100%; padding:10px 5%; background-color:#000000; overflow:hidden; }
footer div.con h5 { height:6.4rem; float:left; }
footer div.con h5 img { height:100%; }
footer div.con ul { margin-left:30%; line-height:1.6rem; }
footer div.con ul li a { color:#ffffff; }
footer div#fBottom { height:40px; line-height:40px; color:#cccccc; text-align:center; }
footer div#fBottom a { color:#ffffff; }

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

/***** common *****/
html { font-size:75%; }
.pchide { display:none; }

/*** navigation ***/
#gnav h1 { left:2.5%; }
nav{ display:flex; flex-direction:row; width:100%; }
.navbar_toggle{ display: none; }
.menu{ width: 100%; -webkit-transform: translateX(0); transform: translateX(0); }
.menu ul{ height:40px; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; background:none; }
.menu ul li{ padding: 0 1em; border-bottom: none; }
.menu ul li a:after { display:none; }


/*** header ***/
#index header{ -moz-background-size:cover; -webkit-background-size:cover; -o-background-size:cover; -ms-background-size:cover; background-size:cover; }

/*** Contents ***/
div.contents a.btn { width:60%; transition:all .5s ease; }
div.contents a.btn:hover { background-color:#ffffff; }
div#policy div.contents a.btn:hover { background-color:#333333; }

div#intro div.contents ul { overflow:hidden; padding-top:70px; border-top:2px solid #B9B9B9; border-bottom:none;  }
div#intro div.contents ul li:nth-of-type(2) { margin:0 2%; }
div#intro div.contents ul li { width:32%; padding:0; border-top:none; float:left; }
div#intro div.contents ul li a:hover { color:#B9B9B9; }
div#intro div.contents ul li a img.phimg { width:100%; position:relative; }
div#intro div.contents ul li a span { width:100%; float:none; }
div#intro div.contents ul li a span.egttl { position:absolute; top:15%; text-shadow: 1px 1px 1px #333333; }
div#intro div.contents ul li a span.jpttl { top:50%; left:inherit; text-shadow: 1px 1px 1px #333333; }
div#intro div.contents ul li a span.dsc { position:relative; top:inherit; left:inherit; margin-top:20px; }

}

@media screen and (min-width:960px){
	
/***** common *****/
html { font-size:18px; }

/*** navigation ***/
#gnav h1 { height:110px; }

/*** header ***/
#index header{ height:560px; }
header div#copy { height:560px; }
header div#copy p.copy_txt { font-size:1.0rem; }

/*** Contents ***/
div.contents { width:930px; }
div.contitle p { font-size:2.2rem; }
div.contitle h2 { font-size:1.7rem; margin:30px 0 70px; }
div.contitle h2:before { top:-20px; }

div.con01 div.imgarea { width:780px; height:300px; margin-left:auto; margin-right:auto; }

div.con01 div.contents { width:780px; }

div.contents a.btn { width:430px; font-size:1.4rem; height:50px; line-height:50px; }

div#intro div.contents h3 { font-size:2.2rem; margin-bottom:50px; }
div#intro div.contents p { font-size:1.0rem; line-height:2.0em; }
div#intro div.contents ul li a span.dsc { font-size:1.0rem; }

div#news dl { font-size:1.0rem; }

div#business div.contents { width:780px; }
div#business .description { font-size:1.3rem; line-height:2.0em; }
div#business .item { margin-top:80px; }
div#business .item h3 { font-size:1.7rem; }
div#business .item p { font-size:1.0rem; line-height:2.0em; }

div.contents dl { font-size:1.0rem; }

div#policy div.contents p { font-size:1.0rem; line-height:1.5em; }

/*** footer ***/
footer div.con { padding:40px 0; }
footer div.con div { margin-left:auto; margin-right:auto; width:480px; }
footer div.con h5 { height:5.4rem; }
footer div.con ul { font-size:0.7rem; line-height:2.0em; }
footer div#fBottom { font-size:0.7rem; }

}

/*****  privacy   *****/
#privacy #wrapper { padding:5%; }
#privacy h2 { padding: 0 0 3rem 0; text-align: center; font-size: 2rem; }
#privacy h3{ margin: 3rem 0 1rem 0; border-bottom: 1px #000 solid; line-height: 3rem; font-size: 1.6rem; }
#privacy p, #privacy ol { line-height: 2rem; list-style-type: square; list-style-position: inside; }
#privacy p, #privacy ol li { padding-left:-2%; }