@charset "UTF-8";

   /*Slide*/
.onlypc{display:none;}
.swiper-slide{position:relative!important;}
.slideinner{max-width:1400px;width:90%;}
.slideinner a{color:#DF5B0F;display:inline-block;border-bottom:1px dotted #DF5B0F;}
.slideinner a:hover{color:rgba(223, 91, 15, 0.68);cursor:pointer;}
.slideinner a.btn{display:block;font-size:13px;background:#DF5B0F;padding:8px 0;margin:19px auto 0;width:150px;text-align:center;color:#fff;border:#fff 1px solid;text-shadow:none;}

.slideinner a.btn:hover{background:rgba(223, 91, 15,.8);}
.bottombtn{bottom:50px;position:absolute;left:0;right:0;max-width:90%;margin: auto;}

.intro_story{width:100%;padding:20px 0 30px;background:rgba(0, 0, 0,.8);z-index:10;position:relative;}
.bottombtn_story{bottom:left:0;right:0;max-width:1200px;width:90%;margin: auto;text-align:left;color:#fff;font-size:14px;}
   
   .swiper-container {
      width: 100%;
      height: 400px;
       overflow:hidden;
       margin-top:56px;
       position:relative;
    }
.swiper-container-story {
      width: 100%;
       margin-top:56px;
       position:relative;
    }
.swiper-container-story .swiper-wrapper{
    height: 56.25vw;
       overflow:hidden;}

  .swiper-container-slim {
      width: 100%;
      height: 280px;
       overflow:hidden;
       margin-top:56px;
       position:relative;
    }
 .swiper-container-slim2 {
      width: 100%;
      height: 280px;
       overflow:hidden;
       margin-top:-50px;
       position:relative;
     margin-bottom:40px;
    }

    .swiper-slide {
      
    background-position: center;
    background-size:auto 100%;
      
        text-align: center;
      font-size: 20px;
        color:#fff;
      text-shadow:
    black 0px 1px 5px, black 0px -1px 5px;
     
      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
        position:relative;
    }


.slideinner p{font-size:14px;margin-top:10px;}

@media screen and (min-width:600px) {
    
    
.swiper-container {
      height: 500px;
    }
    
.swiper-container-story .swiper-wrapper {
      height: 50vw;
    }    
    
.swiper-container-slim {
      height: 400px;
    }
    .swiper-container-slim2 {
      height: 360px;
    }
    
    .swiper-slide {font-size: 27px;}

.slideinner a.btn{font-size:16px;margin:50px auto 0;width:200px;padding:10px 0;
}

.slideinner .ttl{line-height:50px;}
.slideinner p{font-size:17px;}
    
    .bottombtn{bottom:80px;}
    
   
}

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


 @media screen and (min-width:1100px) {
     .onlypc{display:inline-block;}
     .onlysp{display:none;}
.swiper-container {
      height: 680px;
    margin-top:60px;
    }
  
.swiper-container-story {
      margin-top:60px;
    }     
.swiper-container-story .swiper-wrapper {
      height: 680px;
    }       
.swiper-container-slim {
      height: 500px;
    margin-top:60px;
    }  
     
     .swiper-container-slim2 {
      height: 400px;
    margin-top:-40px;
         margin-bottom:50px;
    }   
     
     
     .swiper-slide {font-size: 36px;}
      .intro_story{bottom:0;position:absolute;width:100%;padding:40px 0;background:rgba(0, 0, 0,.6);z-index:10;} .bottombtn_story{font-size:15px;padding:0 1.5%;}
}

 @media screen and (min-width:1500px) {
.swiper-slide {
      
    background-position: center;
    background-size: 100% auto;
}
}

/*Content*/
.hanyou_margin{margin-top:15px!important;}
.hanyou_title{background:#F4AF83;height:170px;margin-top:56px;overflow:hidden;}
.hanyou_inner{max-width:1500px;position:relative;margin:0 auto;text-align:center;width:100%;line-height:170px;}
.hanyou_inner:after{content:url(../images/common/mi7logo_back.png);position:absolute;left:0;top:0;z-index:0;}

h2,h3,h4{text-align:center;margin:0;font-weight:normal;z-index:1;position:relative;}
h3{font-size:30px;margin-bottom:35px;}

h5{color: #DF5B0F;font-size:16px;font-weight:normal;}
h6{font-size:26px;margin-bottom:10px;font-weight:normal;}
h7{font-size:22px;margin-bottom:30px;padding-left:10px;border-left:5px solid #de591b;width:97%;margin-left:1.5%;margin-top:5px;}
.p17{padding:17px}
.introtext{margin-top:-10px;}
.colum4 .p17{padding:10px 0 0 0!important;}
.p10{padding:10px 0 0 0;}
.p10 p{font-size:15px!important;}
p.story_q{font-size:15px!important;color:#aaa;font-weight:bold;margin:0!important;}
p.story_a{font-size:15px!important;margin:20px 0!important;}
p.story_t{font-size:15px!important;color:#de591b;margin:20px 0!important;}
.caption{display:block;width:100%;margin-bottom:20px;}

.contentinner{max-width:1200px;
    margin:0 auto 50px;width:90%;display:block;}
.boxarea{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;display: -webkit-flex;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-bottom:30px;}

.colum1{padding:0 1.5% 35px;font-size:15px;}
.graybk{background:#F4F4F5;}

.colum2 .boxcell{width:100%;margin:0 0 20px;}
.colum3 .boxcell{background:#F4F4F5;width:100%;margin:0 0 20px;}
.colum4 .boxcell{width:47%;margin:0 1.5% 3%;}

.widebox{width:100%;overflow:hidden;position:relative;background:#000;}
.squarebox{width:100%;position:relative;border:1px solid #eee;}

.colum2 .boxcell .widebox{height:240px;}
.colum4 .boxcell .widebox{height:150px;}


.rightimg{width:250px;display:inline-block;padding:10px;}



.widebox span,
.squarebox span
{position:absolute;height:25px;background:#DF5B0F;bottom:0;right:0;z-index:0;font-size:11px!important;line-height:25px;color:#fff;text-align:center;margin-bottom:0!important;padding:0 15px 0 15px;vertical-align: middle!important;}

.widebox span:before,.squarebox span:before{background:#DF5B0F;-webkit-transform: skewX(-40deg);-ms-transform: skewX(-40deg);transform: skewX(-40deg);width:25px;height:25px;left:-15px;bottom:0;position:absolute;z-index:1;content:''}

.forproduct .squarebox span{background:#efefef;}
.forproduct .squarebox span:before{background:#efefef;}
.forproduct .squarebox span img{width:20px;margin:6px 10px 0 0;}


.boxcell img{width:100%;}
.boxcell span{font-size:12px;display:inline-block;}
.boxcell p{font-size:14px;margin-top:10px;margin-bottom:10px;}

.company{margin-top:15px;}
.company p{margin-top:10px;overflow:hidden;}
.company p a,.company ul a,.company table a{color:#DF5B0F;border-bottom:1px dotted #DF5B0F;display:inline-block;}

.company .squarebox{border:none!important;}
.company .boxcell{margin-bottom:0px!important;}

@media screen and (min-width:500px) {
.colum1{padding:0 1.5% 35px;}  
/*
.colum2 .boxcell{width:47%;margin:0 1.5% 3%;}
.colum2 .boxcell .widebox{height:200px;overflow:hidden;}   
*/
}

@media screen and (min-width:600px) {
  
.colum2 .boxcell{width:47%;margin:0 1.5% 3%;}
/*.colum2 .boxcell .widebox{height:200px;overflow:hidden;}    */
.colum2 .boxcell .widebox{height:250px;overflow:hidden;}
.colum3 .boxcell{width:47%;margin:0 1.5% 3%;}

    
}

@media screen and (min-width:900px) {
.colum3 .boxcell{width:30.3%;}
.colum4 .boxcell{width:22%;margin:0 1.5% 3%;} 
.colum4 .boxcell .widebox{height:180px;overflow:hidden;}
h5{color: #DF5B0F;font-size:18px;}
    
}
@media screen and (min-width:1100px) {
.hanyou_title{background:#F4AF83;height:175px;margin-top:60px;}
}
@media screen and (min-width:1190px) {
  
.colum2 .boxcell .widebox{height:350px;overflow:hidden;}
.colum4 .boxcell .widebox{height:220px;overflow:hidden;}
    
}

.infobox{background:#efefef;font-size:14px;padding:15px;margin:0 1.5% 30px;}
a.underbar{display:inline-block;border-bottom:#000 dotted 1px;margin-top:5px;}
/*.boxarea a.noline{border:none!important;display:inline;}*/

.ainfobox{/*background:#666;*/color:#fff;margin-top:-40px;overflow:hidden;}
.ainfoinner{max-width:1200px;margin:60px auto 0;width:90%;}
.ainfoinner a{color:#fff;border-bottom:1px dotted #fff;}
.ainfoinner a:hover{color: #DF5B0F;}

/*video*/

.video{
  position:relative;
  width:100%;
  padding-top:56.25%;
}
.video iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}

/*map*/
.about_map{width:100%;margin:40px auto -30px;height:300px;position:relative;}
.about_map iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}
/*popup*/

/**
 * Simple fade transition,
 */
.mfp-fade.mfp-bg {
	opacity: 0;
	-webkit-transition: all 0.15s ease-out; 
	-o-transition: all 0.15s ease-out; 
	transition: all 0.15s ease-out;
}
.mfp-fade.mfp-bg.mfp-ready {
	opacity: 0.8;
}
.mfp-fade.mfp-bg.mfp-removing {
	opacity: 0;
}

.mfp-fade.mfp-wrap .mfp-content {
	opacity: 0;
	-webkit-transition: all 0.15s ease-out; 
	-o-transition: all 0.15s ease-out; 
	transition: all 0.15s ease-out;
}
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
	opacity: 1;
}
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
	opacity: 0;
}


/*　CUSTOM　*/

.submitbutton {
  -webkit-appearance: none;
  display       : inline-block;
  border-radius : 0%;
  font-size     : 12pt;
  text-align    : center;
  cursor        : pointer;
  padding       : 12px 12px;
  background    : #de591b;
  color         : #ffffff;
  line-height   : 1em;
  opacity       : 0.9;
  transition    : .3s;
}
.submitbutton:hover {
  opacity       : 1;
}

.submitbutton-red {
  -webkit-appearance: none;
  display       : inline-block;
  border-radius : 10px;
  font-size     : 10pt;
  text-align    : center;
  cursor        : pointer;
  padding       : 12px 12px;
  background    : #c80000;
  color         : #ffffff;
  line-height   : 1em;
  opacity       : 0.9;
  transition    : .3s;
}
.submitbutton-red:hover {
  opacity       : 1;
}

input[type="text"],
textarea {
    padding: 0.8em;
    outline: none;
    border: 1px solid #DDD;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-size: 16px;
}
textarea {
    width: 100%;
}
input[type="text"]:focus,
texture:focus {
    box-shadow: 0 0 7px #de591b;
    border: 1px solid #de591b;
}

select::-ms-expand {
display: none;}select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;	margin-bottom: 20px;
padding: 7px 30px 7px 10px;
    font-size: 16px;
    color: #fff;
line-height: 1.1em;	border-radius: 5px;
border: none;	background-image: url(/images/common/icon_arrow.svg);
background-repeat: no-repeat;
background-size: 12px 10px;
background-position: right 10px center;
background-color: #f3ae85;
}

/*　TABLE Responsive　*/
 
/*親要素の幅に伸ばす*/
.table-res-form {
    width: 100%;
}
/*一行毎に上ボーダー*/
.table-res-form tr {
    border-top: 1px #DDD solid;
}
/*一番上行だけボーダーなし*/
.table-res-form tr:first-child {
    border-top: none;
}
/*奇数行だけ背景色*/
.table-res-form tr:nth-child(2n+1) {
    background: #eee;
}
/*thとtd内の余白指定*/
.table-res-form th, .table-res-form td {
    padding: 1.5em;
}
/*thは30%幅、テキストを右寄*/
.table-res-form th {
    width: 60%;
    text-align: center;
    display: inline-block;
}
/*「必須」*/
.table-res-form .requied {
    font-size: 0.8em;
    color: #FFF;
    display: inline-block;
    padding: 0.3em 0.3em 0.2em;
    background: #f3ae85;
    border-radius: 2px;
}
 
/*768px以下指定START*/
 
@media only screen and (max-width: 768px) {
　　　　　/*thとtdをブロック化して幅100％にして縦*/
    .table-res-form th, .table-res-form td {
        width: 100%;
        display: block;
    }
　　　　　/*thの不要な余白削除/テキスト左寄せ*/
    .table-res-form th {
        padding-bottom: 0;
        text-align: left;
    }
　　　　　/*不要な最終行左thを非表示*/
    .table-res-form .empty {
        display: none;
    }
}
 
/*768px以下指定END*/
 
/*INPUT STYLE*/
 
/*BASIC*/
.table-res-form input[type="text"], input[type="email"], textarea {
    border: 1px #f3ae85 solid;
    padding: 0.5em;
    border-radius: 5px;
    margin-bottom: 0.5em;
    width: 100%;
}
/*FORCUS*/
.table-res-form input[type="text"]:focus, textarea:focus {
    background: #f3ae85;
    box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.5);
}
/*SUBMIT*/
.table-res-form input[type="submit"] {
    -webkit-appearance: none;
    border: 1px #de591b solid;
    padding: 0.5em 4em;
    border-radius: 3px;
    background: #de591b;
    color: #fff;
    box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.5);
}
/*SUBMIT Mouse over*/
.table-res-form input[type="submit"]:hover {
    background: #de591b;
    box-shadow: none;
}




ul.mi7{
  counter-reset:list;
  list-style-type:none;
  padding:0;
}
ul.mi7 li{
  position:relative;
  padding: 0 0 0 20px;
  margin: 7px 0 7px 0px;
  line-height: 30px;
  border-bottom: dashed 1px #f3ae85;
}
ul.mi7 li:before{
  counter-increment: list;
  content: "";
  display: block;
  position: absolute;
  left: 0px;
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background: #de591b;
   top:0.8em;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}


ol.mi7{
   counter-reset:number; 
   list-style-type: none; 
   padding:0;
   margin:0;
}
ol.mi7 li { 
   position: relative;
   margin:0.5em 0 !important;
   padding-left: 1.8em;
}
ol.mi7 li:before {
   counter-increment: number;
   content: counter(number);
   background-color: #de591b; 
   color: #fff; 
   position: absolute;
   font-size: 14px;
   border-radius: 50%;
   left: 0;
   top:0em;
   width: 22px;
   height: 22px;
   line-height: 22px;
   text-align: center;
}