﻿@charset"utf-8";
/*unity*/
/* -------------------------------->font =============================*/
.fon_b{font-weight:bold;}
.fon_90{font-size:90%;line-height:1.2em;}
.fon_90_bol{font-size:90%;line-height:1.2em;font-weight:bold;}
.fon_80{font-size:80%;line-height:1.2em;}
.fon_80_bol{font-size:80%;font-weight:bold;line-height:1.2em;}
.fon_70{font-size:70%;line-height:1.2em;}
.fon_70_bol{font-size:70%;font-weight:bold;line-height:1.2em;}

h2 {line-height:1.2em;margin:0px;font-size:140%;}
h3 {line-height:1.2em;margin:0px;font-size:120%;}

/* ===========================役物===============================*/
/* ------------------------->コーナー*/
.R8{border-radius:8px/8px;}

/* -------------------------------->役物 ===============================*/
.cr{clear:both;}

.red{color:#ff0000;}

.dot_border06{
 height:6px;
 border-bottom:1px dotted #717071;
 margin-bottom:6px;
 clear:both;
}
.dot_border04{
 height:4px;
 border-bottom:1px dotted #717071;
 margin-bottom:4px;
 clear:both;
}

.border_box{
 border:1px solid #595757;
 padding:20px;
 margin:20px;
}

@media screen and (max-width:799px){
.img_1coma{
 width:32vw;
 height:32vw;
 float:left;
}
}
@media screen and (min-width:800px){
#middle_block .img_1coma{
 width:10.25vw;
 height:10.25vw;
 float:left;
}
}

.img_1coma img{
 width:100%;
}

@media screen and (max-width:799px){
.middle_img{
 width:96vw;
 overflow:hidden;
}
}

@media screen and (min-width:800px){
.middle_img{
 width:92.5vw;
 overflow:hidden;
}
}

@media screen and (max-width:799px){
.s{
 display:block;
}
.pc{
 display:none;
}
}
@media screen and (min-width:800px){
.pc{
 display:block;
}
.s{
 display:none;
}
}

.form_btn{
 width:120px;
 height:30px;
 line-height:30px;
 text-align:center;
 float:left;
 margin-right:10px;
 border-radius:6px/6px;
 font-size:80%;
 cursor:pointer;
}
.form_btn a{
 color:#ffffff;
 text-decoration:none;
 display:block;
}
.dark_gray{
 color:#ffffff;
 background:#221814;
}
.medium_gray{
 color:#ffffff;
 background:#595757;
}

/* -------------------------------->サイズ==============================*/
.w100{width:100%;}
.w80{width:80%;}
.w60{width:60%;}
.w50{width:50%;}
.w40{width:40%;}
.w30{width:30%;}

/* =========================ID一覧=========================*/
@media screen and (max-width:799px){
#top_logo_s{
 position:fixed;
 top:0vw;
 left:2vw;
 width:100vw;
 height:12vw;
 overflow:hidden;
 z-index:20;
 background:#ffffff;
}
#top_logo_s img{
 width:70vw;
 float:left;
}
}
@media screen and (min-width:800px){
#top_logo_s{
 position:fixed;
 top:0vh;
 left:0vw;
 width:4.2vw;
 height:16.5vw;
 overflow:hidden;
 z-index:20;
}
#top_logo_s img{
 width:100%
}
}

@media screen and (max-width:799px){
#menu_btn{
 position:fixed;
 top:3px;
 right:3px;
 width:40px;
 height:40px;
 z-index:30;
}
#navi_var{
 position:fixed;
 top:12vw;
 left:0vw;
 width:100%;
 height:36px;
 background:#221814;
 overflow:hidden;
 z-index:30;
}
#menu_bar{
 position:fixed;
 top:40px;
 right:0px;
 z-index:100;
 width:40vw;
 overflow:hidden;
 float:right;
 clear:both;
 background:#221814;
 display:none;
}
#menu_bar li{
 font-size:80%;
}
#menu_bar li a{
 color:#fff;
 font-weight:bold;
 height:30px;
 display:block;
 border-bottom:1px solid #fff;
 text-align:center;
 line-height:30px;
 text-decoration:none;
 overflow:hidden;
 margin-bottom:4px;
}
#menu_bar li a:hover{
 height:30px;
 display:block;
 border-bottom:1px solid #fff;
 background:#595757;
 transition-duration:0.4s;
 transition-delay:0.05s;
}
}
@media screen and (min-width:800px){
#menu_btn{
 display:none;
}
#navi_var{
 position:relative;
 top:0vh;
 left:0vw;
 width:100%;
 height:36px;
 background:#221814;
 overflow:hidden;
 z-index:30;
}
#menu_bar{
 width:854px;
 float:right;
 padding:0px;
}
#menu_bar li{
 font-size:80%;
 float:left;
}
#menu_bar li a{
 color:#fff;
 font-weight:bold;
 width:120px;
 height:36px;
 display:block;
 border-left:1px solid #fff;
 border-right:1px solid #fff;
 text-align:center;
 line-height:36px;
 text-decoration:none;
 overflow:hidden;
}
#menu_bar li a:hover{
 width:120px;
 height:36px;
　display:block;
 border-left:1px solid #fff;
 border-right:1px solid #fff;
 background:#595757;
 transition-duration:0.4s;
 transition-delay:0.05s;
}
}

@media screen and (max-width:799px){
#main_box{
 position:relative;
 top:12vw;
 float:left;
 width:96vw;
 margin-left:2vw;
 overflow:hidden;
}
}
@media screen and (min-width:800px){
#main_box{
 position:relative;
 top:0vh;
 float:right;
 width:100vw;
 overflow:hidden;
}
}

@media screen and (max-width:799px){
#loader-bg{
 position:relative;
 top:1vh;
 width:100%;
 height:37vw;
 background:#fff;
 overflow:hidden;
 z-index:100;
}
#loader-bg #loader{
 margin-left:calc( 50% - 20px );
 margin-top:calc( 18.5vw - 20px );
 width:40px;
 height:40px;
 overflow:hidden;
}
#loader img{
 width:100%;
}
}
@media screen and (min-width:800px){
#loader-bg{
 position:relative;
 top:1vh;
 left:1vw;
 width:99vw;
 height:32vw;
 background:#fff;
 overflow:hidden;
 z-index:100;
}
#loader{
 margin-left:calc( 46.25vw - 45px );
 margin-top:calc( 17.7vw - 45px );
 width:90px;
 height:90px;
 overflow:hidden;
}
#loader img{
 width:100%;
}
}

@media screen and (max-width:799px){
#middle_block_about{
 width:96vw;
 height:48vw;
 float:left;
 display:none;
 background:url(../img/middle_about.jpg);
 background-repeat:no-repeat;
 background-size:100%;
}
#middle_block_recruit{
 width:96vw;
 height:48vw;
 float:left;
 display:none;
 background:url(../img/middle_recruit.jpg);
 background-repeat:no-repeat;
 background-size:100%;
}
}
@media screen and (min-width:800px){
#middle_block_about{
 width:50vw;
 height:25vw;
 float:left;
 display:none;
 background:url(../img/middle_about.jpg);
 background-repeat:no-repeat;
 background-size:100%;
 cursor:pointer;
}
#middle_block_recruit{
 width:50vw;
 height:25vw;
 float:left;
 display:none;
 background:url(../img/middle_recruit.jpg);
 background-repeat:no-repeat;
 background-size:100%;
 cursor:pointer;
}
}

@media screen and (max-width:799px){
#bottom_block{
 width:100%;
 min-height:6vw;
 background:#e5e6e6;
 font-size:80%;
 float:left;
 display:none;
}
#bottom_block a{
 color:#221814;
}
#bottom_block a:hover{
 color:#009943;
 text-decoration:none;
}
.bottom_separate{
 width:100%;
 padding:1vh;
 clear:right;
 overflow:hidden;
}
}
@media screen and (min-width:800px){
#bottom_block{
 width:100%;
 min-height:6vw;
 background:#e5e6e6;
 font-size:80%;
 float:left;
 display:none;
}
#bottom_block a{
 color:#221814;
}
#bottom_block a:hover{
 color:#009943;
 text-decoration:none;
}
.bottom_separate{
 width:100%;
 padding:1vh;
 clear:right;
 overflow:hidden;
}
}

#trust{
 float:left;
 width:130px;
 height:42px;
 padding-left:30px;
}

#privacy_mark{
 position:relative;
 left:-100px;
 top:60px;
 width:100px;
 height:150px;
 text-align:center;
 font-size:10px;
 overflow:hidden;
 }
#privacy_mark img{
 width:100%;
}
 
@media screen and (max-width:799px){
#under_link1{
 float:right;
 margin-right:1vh;
 text-align:left;
}
#under_link2{
 float:right;
 text-align:left;
}
}
@media screen and (min-width:800px){
#under_link1{
 float:right;
 margin-right:1vh;
 text-align:left;
}
#under_link2{
 float:right;
 text-align:left;
}
}

@media screen and (max-width:799px){
#copy{
 width:100%;
 text-align:center;
 padding:6px;
 font-size:90%;
 color:#ffffff;
 background:#221814;
 overflow:hidden;
}
.under_icon{
 width:40px;
 float:right;
 margin-left:1vw;
 margin-bottom:1vw;
}
}
@media screen and (min-width:800px){
#copy{
 float:right;
 margin-right:1vw;
 height:40px;
 padding-top:24px;
 font-size:90%;
}
.under_icon{
 width:40px;
 float:right;
 margin-left:6px;
}
}

/* =====================全体固定の指定部======================*/

div{box-sizing:border-box;}

ul{
 margin:0;
 padding:0;
 }
li{
 list-style:none;
}

img {border:0px;}
a:hover img {
 filter:alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}
a:active img {
 filter:alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}
a img {
 filter:alpha(opacity=100);
 -moz-opacity: 1;
  opacity: 1;
}

body { 
 margin:0 auto;
 text-align:center;
 color:#3e3a39;
 font-family:"メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS P Gothic",sans-serif;
 line-height:1em;
 background:#ffffff;
 /*background:url('../images/static/body_back_01.jpg');*/
 background-position:center right;
 background-repeat:no-repeat;
 background-size:cover;
}
