@charset "utf-8";

/*--
中 font-size:96%;
小 font-size:88%;
--*/
@import url('https://fonts.googleapis.com/css?family=Dosis:400,600|Roboto:400,500');
a {
-webkit-tap-highlight-color: rgba(0,0,0,0);
}

body{
color:#4d4d4d;
font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
font-size:93.75%;
line-height:1.8;
background:#fff;
-webkit-text-size-adjust: 100%;
font-weight:500;
}
.dosis{
font-family: 'Dosis', 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
font-weight:600;
letter-spacing:0.1em;
}
.dosis.reg{
font-weight:400;
}
.roboto{
font-family: 'Roboto', 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
font-weight:500;
}
.pc{
display:block !important;
}
.tab-pc{
display:block !important;
}
.tab{
display: none !important;
}
.sp-tab{
display:none !important;
}
.sp{
display:none !important;
}
@media screen and (max-width:980px){
.pc{
display:none !important;
}
.tab{
display:block !important;
}
.sp-tab{
display:block !important;
}
}
@media screen and (max-width:767px){
body{
font-size:10pt;
}
.tab-pc{
display: none !important;
}
.tab{
display: none !important;
}
.sp{
display:block !important;
}
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}

/*---------------------------------------*/
/* header */
/*---------------------------------------*/
#header{
width:100%;
height:120px;
background:rgba(255,255,255,0.9);
position:fixed;
top:0;
left:0;
z-index:999;
}
@media screen and (max-width:980px){
#header{
height:70px;
}
}
#header .logo{
position:absolute;
top:28px;
left:5%;
width:411px;
}
@media screen and (max-width:1200px){
#header .logo{
width:280px;
top:33px;
}
}
@media screen and (max-width:980px){
#header .logo{
top:10px;
}
}
@media screen and (max-width:767px){
#header .logo{
width:210px;
top:15px;
}
}
#header .logo img{
width:100%;
height:auto;
}
#header .hNavi{
position:absolute;
top:43px;
right:5%;
height:34px;
}
#header .hNavi li{
display:inline;
float:left;
margin-left:18px;
font-size:86%;
}
@media screen and (max-width:1200px){
#header .hNavi li{
margin-left:12px;
}
}
#header .hNavi li a{
display:block;
padding:0 15px;
background:rgba(255,255,255,0);
height:34px;
line-height:34px;
border-radius:17px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
@media screen and (max-width:1200px){
#header .hNavi li a{
padding:0 10px;
}
}
.pcContent #header .hNavi li a:hover{
background:#f5874a;
}
#header .hNavi li.on a{
background:#f5874a;
}
/*---------------------------------------*/
/* spNavi */
/*---------------------------------------*/
.spNaviBg{
position:fixed;
top: 0;
right:0;
width:70px;
height: 70px;
background:#f5874a;
z-index:999;
}
a.c_nav-bt{
position:fixed;
top: 16px;
right: 23px;
width: 25px;
height: 25px;
text-align: center;
opacity: 1;
z-index: 10000;
cursor:pointer;
}
#panel-btn  .note{
font-size:73%;
font-weight:500;
white-space: nowrap;
margin-top: 25px;
transition: .2s;
color:#fff;
letter-spacing:0.2em;
width: 31px;
margin-left: -3px;
}
#panel-btn .note.close{
opacity:0;
}
#panel-btn-icon{
display: block;
position: absolute;
top: 50%;
left:0;
width: 25px;
height: 3px;
background: #fff;
transition: .2s;
border-radius:2px;
}
#panel-btn-icon:before, #panel-btn-icon:after{
display: block;
content: "";
position: absolute;
top: 50%;
left: 0;
width: 25px;
height: 3px;
background: #fff;
transition: .3s;
border-radius:2px;
}
#panel-btn-icon:before{
margin-top: -10px;
}
#panel-btn-icon:after{
margin-top:7px;
}
#panel-btn .close{
background: transparent;
}
#panel-btn .close:before, #panel-btn .close:after{
margin-top: 0;
}
#panel-btn .close:before{
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
background: #fff;
}
#panel-btn .close:after{
transform: rotate(-135deg);
-webkit-transform: rotate(-135deg);
background: #fff;
}
div.accordion{
overflow-y: scroll;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: rgba(0,0,0,0.4);
z-index: 9999;
}
.accordion .inbox{
background-color:#f5874a;
padding: 80px 5% 20px;
margin: 0 0 0 50%;
width:auto;
height: auto;
}
@media screen and (max-width:767px){
.accordion .inbox{
margin: 0 0 0 25%;
padding:50px 5% 20px;
}
}
/* メニュースタイル*/
.accordion .inbox ul li{
padding:5px 0;
font-size:130%;
line-height:1.1;
margin-bottom:30px;
}
@media screen and (max-width:767px){
.accordion .inbox ul li{
font-size:11pt;
margin-bottom:20px;
}
}
.accordion .inbox ul li a{
	position:relative;
}
.accordion .inbox ul li a:after{
content:"";
position:absolute;
bottom:-10px;
left:0;
width:0%;
height:1px;
background:#fff;
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
-ms-transition: all 0.2s;
transition: all 0.2s;
}
.pcContent .accordion .inbox ul li a:hover:after{
width:100%;
}
/*---------------------------------------*/
/* footer */
/*---------------------------------------*/
.recruitpage #footer{
margin-bottom:100px;
}
@media screen and (max-width:767px){
.recruitpage #footer{
margin-bottom:55px;
}
}
#footer{
background:#fef6f1;
text-align:center;
padding:30px 0;
font-size:86%;
}
@media screen and (max-width:767px){
#footer{
font-size:8pt;
padding:15px 0;
}
}
#footer .fLogo{
width:346px;
margin:0 auto 20px;
}
@media screen and (max-width:767px){
#footer .fLogo{
width:220px;
margin:0 auto 10px;
}
}
#footer .fLogo img{
width:100%;
height:auto;
}
#footer .copy{
color:#f5874a;
margin-top:10px;
}
@media screen and (max-width:767px){
#footer .copy{
font-size:7pt;
}
}
/*---------------------------------------*/
/* gotop */
/*---------------------------------------*/
.gotop{
position:fixed;
bottom:165px;
right:0;
z-index:998;
}
.gotop a{
display:block;
position:relative;
top:0;
transform: rotate(90deg);
-webkit-transform: rotate(90deg);
}
.pcContent .gotop a:hover{
	top:-5px;
}
.gotop a .arrow{
width:20px;
height:20px;
font-size:20px;
display:inline-block;
transform: rotate(180deg);
-webkit-transform: rotate(180deg);
vertical-align:middle;
position:absolute;
top:7px;
right:-30px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.pcContent .gotop a:hover .arrow{
right:-35px;
}
/*---------------------------------------*/
/* layout */
/*---------------------------------------*/
#container{
margin-top:120px;
}
@media screen and (max-width:980px){
#container{
margin-top:70px;
}
}
.blockLeft{
float:left;
}

.blockRight{
float:right;
}

.txtRight{
text-align:right;
}

.txtCenter{
text-align:center;
}