﻿@import url("//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css");
/* Reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,detail,embed,figure,figcaption,footer,#header,.header_inner,hgroup,menu,nav,output,ruby,.section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:16px 100%;font:inherit;vertical-align:baseline}article,aside,details,detail,figcaption,figure,footer,#header,.header_inner,hgroup,menu,nav,.section,.row{display:block}body{line-height:1.6em}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}
body { font-family:'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif; text-align:center;background-color:#000;}
div, ul,li,p,table,td,tr,a{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing:border-box}
ul li{font-size:14px;line-height:1.8em;}
a {text-decoration:none}
a:focus { outline:none;}
p {line-height:1.6em;text-align:left}
img{max-width:100%; height:auto; display:block; margin:0 auto}
h1,h2,h3,h4{text-align:left;font-weight:bold; line-height:1.2em; letter-spacing:1px;}
h1{font-size:24px}
h2{font-size:24px;}
h3{font-size:32px;}
h4{font-size:32px;}
.br{display:inline-block}
.pcbr{display:block}
#wrapper{background-color:#000;}
#header {position:fixed; width:100%;z-index:10;background-color:rgba(0, 0, 0, 0.8)}
.logo_main{width:40%; height:auto; max-width:768px;min-width:240px;}
.inner{width:100%; max-width:1000px; margin:0 auto; overflow:hidden;position:relative; padding-bottom:3.6em;}
#header .goldline{width:50%}
#header .inner{padding-bottom:0}
#top{color:#fff}
#top{position: relative; width: 100%;  overflow: hidden;}
#top img{width:100%;}
/* slick-slider */
#top-slider{width:100%; position:relative}
.slick-slider{position: relative; display: block;  box-sizing: border-box;  -webkit-user-select: none;  -moz-user-select: none;   -ms-user-select: none;user-select: none;-webkit-touch-callout: none;-khtml-user-select: none;-ms-touch-action: pan-y;touch-action: pan-y; -webkit-tap-highlight-color: transparent;}
.slick-list{position: relative;display: block;overflow: hidden;margin: 0;padding: 0;}
.slick-list:focus{outline: none;}
.slick-list.dragging{cursor: pointer;cursor: hand;}
.slick-slider .slick-track,
.slick-slider .slick-list{-webkit-transform: translate3d(0, 0, 0);   -moz-transform: translate3d(0, 0, 0);    -ms-transform: translate3d(0, 0, 0);     -o-transform: translate3d(0, 0, 0);        transform: translate3d(0, 0, 0);}
.slick-track{position: relative;top: 0;left: 0;display: block;margin-left: auto;margin-right: auto;}
.slick-track:before,
.slick-track:after{display: table;content: '';}
.slick-track:after{clear: both;}
.slick-loading .slick-track{visibility: hidden;}
.slick-slide{display: none;float: left;height: 100%;min-height: 1px; outline: none;}
[dir='rtl'] .slick-slide{float: right;}
.slick-slide img{display: block;}
.slick-slide.slick-loading img{display: none;}
.slick-slide.dragging img{pointer-events: none;}
.slick-initialized .slick-slide{display: block;}
.slick-loading .slick-slide{visibility: hidden;}
.slick-vertical .slick-slide{display: block;height: auto;border: 1px solid transparent;}
.slick-arrow.slick-hidden {display: none;}
/* to be deleted */
#intro, #profile{position:relative;z-index:9;margin-top:-50px}
/* end to be deleted */
h1{line-height:1.6em; text-align:center;padding:1em 0;}
h1.nomal{font-weight:normal; text-align:left; font-size:18px}
.tit-exe{font-family: trajan-pro-3, serif;font-weight: 400;font-style: normal; color:#fff; text-align:center; margin-bottom:0.4em; font-size:36px}
ul.idx, ul.idx a{color:#000}
ul.idx{margin:20px auto}
ul.idx li{position:relative;overflow:hidden; text-align:left}
.idx-txt{width:50%;background-color:#fff; padding:1.6% 1% 2% 2%}
.idx-txt h2{font-size:22px;margin-bottom:1%}
.idx-img-sp{display:none}
.idx-img-pc{display:block}
.idx-txt{position:absolute;top:0;}
.goldline{position:relative; z-index:1}
.detail{background-color: #000;color: #fff;padding: 0.4em 1.4em;    display: inline-block; margin-top: 1%; border-radius: 20px;}
#main{padding-top:3%}
#main.bg-white{background-color:#fff;padding-top:0 }
.menu{display: none; opacity: 1; position: fixed; top:0; left:0; right:0;bottom:0; overflow-y: auto; overflow-x:hidden;margin:auto;width: 100%;  height: 100%;  color: #000;  z-index: 99; background: #000; max-width:1000px;}
.menu .nav { width: 100%; margin-top: 50px;margin-bottom: 46px; position: static; text-align:center; background:none;}
/* interview */
#top-head{position:relative;}
#top-head .title{position:absolute;width:100%;z-index:9;bottom:0}
#top-head .title:before{
	display: block;
	content: "";
	width: 100%;
	height: 60px;
	background: linear-gradient( transparent, #000); 
}
#top-head .title >*{background-color:#000; }
#top-intro h2{font-size:18px; padding-bottom:1em; font-weight:normal}
p.box{border: solid 1px #fff; padding:1em; margin-bottom:1.6em}
.interview-next{display:inline-block;border: solid 1px #000; padding:1em; margin-bottom:1.6em;}
.interview-next >*{text-align:center}
#top.bg_blur:after {
	display: block;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 70px;
	background: linear-gradient( #000, #fff); 
}
#top.bg_blur .inner{padding-bottom:1em}
.sns_icon div {display:inline-block; margin-right:4px;vertical-align:top}
.fb-like span {vertical-align:top !important}
.img_l{float:left; margin:0em 1em 1em 0; width:40%}
.img_r{float:right; margin:0em 0 1em 1em;width:40%}
.bold{font-weight:bold}
.row{text-align:left; margin-bottom:1.8em}
.interview .row h2{margin-top:0.4em;margin-bottom:0.8em}
.interview .row p{margin-bottom:1.4em}
/* nav */
nav ul {text-align:center; line-height:1.6em}
nav ul li{margin-bottom: 20px;font-size:20px; line-height:1.6em}
nav ul li a{color:#fff}
nav ul li a:hover {opacity: 0.5;}
nav ul li span{display:block;;font-size:14px  }
/*menu open close button*/
.button { position:absolute;top: 20px;right: 0; width: 50px;  height: 50px; vertical-align: top; font-size:50px; z-index: 3;}
.button a {text-decoration:none;}
.btn-open:after {color:#fff;content:"\f0c9";font-family:"FontAwesome";transition-property:all .2s linear 0s;-moz-transition:all .2s linear 0s;-webkit-transition:all .2s linear 0s;-o-transition:all .2s linear 0s;}
.btn-open:hover:after {opacity: 0.5;}
.btn-close:after {color:#fff;content:"\f00d";font-family:"FontAwesome";transition-property:all .2s linear 0s;-moz-transition:all .2s linear 0s;-webkit-transition:all .2s linear 0s;-o-transition:all .2s linear 0s; padding-right:20px}
.btn-close:hover:after {opacity: 0.5;}
/* to top */
.pagetop {display: none;position: fixed;bottom: 0;right: 0;}
.pagetop a {display: block;background-color: #808080;text-align: center;color: #222;font-size: 12px;text-decoration: none;padding: 5px 10px;	filter:alpha(opacity=50);-moz-opacity: 0.5;opacity: 0.5;}
.pagetop a:hover {display: block;/*background-color: #b2d1fb;*/
	background-color: #999999;text-align: center;color: #fff;font-size: 12px;text-decoration: none;padding:5px 10px;	filter:alpha(opacity=50);-moz-opacity: 0.5;opacity: 0.5;}
/* footer */
#footer .security{background-color:#fff}
#f_links{background-color:#00a0e2; clear:both}
#f_links a{color:#fff}
#f_links .inner{width:100%; max-width:750px; margin:0 auto;padding:1em; }
#sns_links{background-color:#C8C8C8}
#sns_links ul {font-size:0; max-width:480px; margin:0 auto; padding:4% 0}
#sns_links ul li{display:inline-block;width:22%; margin:0 1%;text-align:center; background-color:#fff}
#sns_links ul li a{display:block; padding:0.4em}
#sns_links ul li img{width:100%;max-width:70px; margin:0 auto}
.infolink {box-sizing:border-box;clear:both; letter-spacing:1pt; text-align:center; overflow:hidden;}
.infolink .f_left{width:50%;float:left; text-align:left; font-size:14px;line-height:1.8em; border-left:solid 1px #fff; padding-left:4%}
.infolink .f_left:first-child{border-left:none; padding-left:0}
.infolink .f_left a{display:block; padding:1em 0}
a.btn_co{background-color:#e40080; color:#fff; font-weight:bold;font-size:14px;  display:inline-block;padding:8px 6px; margin-top:10px;-moz-border-radius: 6px;  -webkit-border-radius: 6px;  border-radius: 6px; text-align:center;max-width:200px;padding:0.4em !important}
a.btn_co:hover{color:#fff; text-decoration:none}
.company{clear:both; overflow:hidden; margin-top:1em}
.companyname {font-size:22px; font-weight:bold; margin-bottom:1%;text-align:left; color:#fff}
.copyright {font-size:12px; text-align:left;  color:#fff}
.f_logo { width:46px; float:left}
.security_mark {padding:4% 0;width:216px; margin:0 auto; overflow:hidden}
.pmark {float:right; margin:0;}
.f_geomark {float:right; margin:2px 10px 0 0; margin-left:-10px}
@media (max-width:1000px){
.inner{position:relative; width:94%; }
.idx-txt h2{font-size:20px;margin-bottom:0.4em}
.idx-txt{padding:1%}
}
@media (max-width:767px){
.pcbr{display:inline}
#header .goldline{width:100%}
ul.idx{max-width:328px; margin:20px auto}
.idx-img-sp{display:block}
.idx-img-pc{display:none}
.idx-txt{width:100%;position:static;padding:1em}
.img_l,.img_r{float:none; width:100%; max-width:640px; margin:0em 0 1em 0;}
/* footer */
.cont{border-left:none;}
.cont:nth-child(1),.cont:nth-child(3)  {width:50%; margin-right:2%}
.cont:nth-child(2),.cont:nth-child(4)  {width:42%; margin-right:0}
}
@media (min-width:599px){
.overlay {display:none !important;}
}
@media (max-width:480px){
nav ul li{font-size:18px}
.button { top: 10px;right: 0; width: 40px;  height: 40px; font-size:40px;}
.idx-txt h2{font-size:20px}
h1{font-size:16px;letter-spacing:0}
#top-intro h2{font-size:16px;}
/* footer */
.cont{padding-left:0}
}