/*------------------------------------------

トップページ
*/

/*
トップページ用ヘッダ
*/
#header { /*width:100%; height:50vw;*/ 
  max-width:1300px; /*max-height:658px;*/ min-height:min(35vw,440px);
  margin: 0 auto; position: relative; }
#header a { text-decoration:none; }
#header .header_inner { max-width: 1024px; width: 100%; margin:0 auto; position: relative;
  padding-top:min(20px,1vw);
  display:flex; flex-wrap:wrap; justify-content:center;
}
#header .header_inner .header_inner1 { max-width:90vw; width:45%; position:relative; margin-bottom:1vw; }
#header img.logo1 { max-width:74vw; width:100%; display:block; margin-top:min(20px,2.5vw); }
#header .logo2 { position: absolute; top:min(130px,20vw); left:1%; max-width:30%; }
#header .logo2 img { width: 100%; }
#header .logo3 { text-align:right; }
#header .logo3 img { display:inline-block; max-width:100%; }
#header .catch {
    color: #00683e; color:#fff; font-size:min(1.3rem,3.4vw); text-shadow:0 0 5px #000;
    z-index: 50;
    max-width:300px; box-sizing:content-box;
    margin-top:7px; padding-left:min(40%,26vw);
    }
#header .catch .catch1 { text-align: justify; line-height: 1.4; }
#header .catch .catch2 { padding: 0; text-align: right; }

#header .head_img1 { z-index: 10; width:45%; max-width:90vw; text-align:right; padding-left:20px; }
#header .head_img1 img { width:100%; }

#header .bg_box img { width: 100%; margin:0px auto 0 auto; position: absolute; }
#header .bg_box .caption { 
  position:absolute; /*bottom:12%;*/ top:min(580px,39vw); right:1%; 
  font-size:1.2rem; font-weight:600; color:#fff; text-shadow:0 0 4px #000; }

@media only screen and (max-width:700px) {
  /* #header { height:calc(36vw + 280px); } */
  #header .header_inner .header_inner1 { width:min(400px,90vw); }
  #header .bg_box img { margin-top:min(90px,10vw); }
  #header .bg_box .caption { right:initial; left:2%; /*bottom:initial; top:min(300px,52vw);*/ top: min(342px, 49vw); }
  #header .logo2 { left:-2vw; }
  #header .head_img1 { width:min(250px,70vw); }
}

#mainvisual { background:url(/images/mainvbg2.svg) center bottom no-repeat; background-size:cover; padding:0 0 70px; }

#index { position:relative; /*margin-top:-190px;*/
  font-family:"Zen Maru Gothic", sans-serif; font-weight:500; text-align:center; }

#index_feature { display:flex; justify-content:center; text-align:center; }
#index_feature .badge { display:block; text-decoration:none; 
  text-shadow:0 0 2px #fff,0 0 2px #fff,0 0 2px #fff,0 0 2px #fff,0 0 2px #fff,1px 1px 0 #fff; 
  background:linear-gradient(rgba(255,255,255,.05),rgba(255,255,255,1));; border:1px solid rgba(210,210,210,.6);
  border-radius:10px; margin:0 min(20px,.6vw); padding:min(50px,1vw) 2px min(65px,2vw); width:min(300px,30vw); }
#index_feature .badge img { display:block; margin:0 auto; width:180px; height:auto; max-width:100%; transition:transform .2s; }
#index_feature .badge:hover img { transform:translateY(-1px);}
#index_feature .badge span { display:block; font-size:min(1.2rem,3vw); font-weight:800; color:#135f36; line-height:1; }
#index_feature .badge h6 { font-size:min(1.6rem, 4vw); font-weight: 800; color: #135f36; line-height:1; margin-top:5px; }
#index_feature .badge h5 { color:#135f36; line-height:1; font-weight:800; margin:3px auto; font-size:min(2.7rem, 6vw); }
#index_feature .badge h5 span { display:inline-block; font-size:min(2.7rem, 6vw); }
#index_feature .badge p { color:#333; line-height:1.5; font-size:min(1.6rem,4vw); margin:0 0 3px; }
@media only screen and (max-width:580px) {
  #index_feature { flex-direction:column; text-align:left; }
  #index_feature .badge { width:99%; display:flex; margin-top:5px; }
  #index_feature .badge img { margin:5px; width:20vw; height:20vw; }
  #index_feature .badge .txt { width:70vw;}
  #index_feature .badge p { line-height:1.3; }
  #index_feature .badge p br { display:none; }
}


.index_table { display:flex; width:min(92vw,1100px); margin:0 auto; margin-top:min(60px,5vw); justify-content:space-between; 
  border-radius:5px; overflow:hidden; }
.index_table .thead { width:24px; display:flex; justify-content:center; 
  padding:2em 5px 0; background:#aaa; 
  font-size:1.45rem; color:#fff; line-height:2.5; }
/*.index_table .tbody { width:calc(100% - 27px); }*/
.index_table .tbody .tr { display:flex; flex-direction:column; }
.index_table .tbody .tr:first-child { margin-bottom:3px; }

.index_table .tbody .tr .th { /*width:160px; */ padding:0px; background-color:#135f36; border-radius:5px 5px 0 0; 
  display:flex; align-items:start; justify-content:center; flex-direction:column; }
.index_table .tbody .tr .th em { display:block; color:#fff; margin:15px 0; }
.index_table .tbody .tr .th a.link { display:inline-block; color:#fff; font-size:1.1rem; padding:0; font-weight:600; }
.index_table .tbody .tr .th a.btn1 { display:inline-block; font-size:1.1rem; padding:0 7px; margin:8px 3px;
  font-weight:600; width:initial; line-height:1.7; }
.index_table .tbody .tr .th a.btn1::after { content:''; background-image:url(/images/icon_right_arrow.svg); 
    filter: brightness(20);
    width: 1em; height: 1em; margin-left:.1em; 
    background: url(/images/icon_right_arrow.svg) center center no-repeat;
    background-size: contain;  
}
.index_table .tbody .tr .th h5 { 
  display:flex; justify-content:flex-start; align-items:center;
  margin:0; padding:0; color:#fff; font-size:min(1.4rem,3.4vw); width:100%; line-height:1.3; }
.index_table .tbody .tr .th h5 span { display:inline-block; text-align:left; line-height:1.2; } 
.index_table .tbody .tr .th h5 span.cc { 
  color:#135f36; color:#fff; font-size:.8em; font-weight:900; text-align:center; 
  width:max(10em,18%); padding:10px min(1vw,19px) 12px min(1vw,17px); 
  background:rgba(0,0,0,.5); }
.index_table .tbody .tr .th h5 span.t { font-size:min(1.4rem,3vw); width:70%; text-align:center; }

.index_table .tbody .tr .td { background-color:#fff; 
  /* overflow:auto; width:calc(100% - 160px); */ 
  display:flex; flex-wrap:wrap; justify-content:space-between; padding:0 1%; }
  /*
  .index_table .tbody .tr .td::-webkit-scrollbar { background:#fff; height:8px; }
  .index_table .tbody .tr .td::-webkit-scrollbar-thumb { background-color:#ddd; border-radius:5px; border:2px solid #fff; }
  .index_table .tbody .tr .td::-webkit-scrollbar-thumb:hover {  background-color:#ddd;}
  */
.index_table .tbody .tr .td .option { min-width:50%; }
.index_table .tbody .tr .td .option > h5 { font-size:1.2rem; color:#444; width:92%;
  margin:10px 4% 0; background:#f6f3e8; padding:3px; line-height:1.2; border-radius:15px; }
.index_table .tbody .tr .td ul { display:flex; align-items:flex-start; justify-content:space-evenly; margin:5px; }
.index_table .tbody .tr .td ul li a { display:block; margin:5px 4px; width:90px; 
  text-decoration:none; color:#333; font-size:min(1.15rem,3vw); font-weight:800; text-align:center; line-height:1.1; }
.index_table .tbody .tr .td ul li a img { display:block; margin:0 auto 5px; max-width:13vw; }
.index_table .tbody .tr .td ul li a span span { display:inline-block; }
.index_table .tbody .tr .td_variation { justify-content:space-evenly; }
.index_table .tbody .tr .td ul.thumbs1 { width:100%; }
.index_table .tbody .tr .td ul.thumbs1 li { width:14%; }
.index_table .tbody .tr .td ul.thumbs1 li a { width:100%; margin-left:auto; margin-right:auto; }
.index_table .tbody .tr .td > .links  { padding:10px 0; text-align:left; width:97%; }
.index_table .tbody .tr .td > .links a  { filter:brightness(0.4) hue-rotate(-90deg); font-size:1.15rem; display:inline-block; padding:2px 5px; margin:0 3px; font-weight:600; }

.index_table .tbody .tr .td .option-badge { width:98%; }
.index_table .tbody .tr .td .option-badge h5 { width:96%; margin:10px auto 0; }

.index_table .tbody .tr .td .option-info { width:min(calc(100% - 400px),42%); min-width:initial; padding-top:20px; }
.index_table .tbody .tr .td .option-info ul { background:#eee; border-radius:10px; padding:5px; flex-wrap:nowrap; }
.index_table .tbody .tr .td .option-info ul li { padding:0 5px; }
.index_table .tbody .tr .td .option-info ul li a { width:min(110px,10vw); }
.index_table .tbody .tr .td .option-info ul li a img { width:68px; }

#index .btnarea { display:flex; flex-wrap:wrap; justify-content:center; margin-top:20px; }
#index .btnarea .item + .item { margin:0 8px; }
#index .btnarea .btn_link { margin:5px 0; font-size:min(1.3rem,3vw); }

@media only screen and (max-width:967px) {
  /* 
  #index { margin-top:calc(50px - 18vw); } 
  .index_table { flex-direction:column; }
  .index_table .thead { width:initial; border-radius:5px 5px 0 0; padding:0 0 0 1em; letter-spacing:.5em; line-height:2; justify-content:left; }
  .index_table .tbody { width:initial; }  
  .index_table .tbody .tr { flex-direction:column; }
  .index_table .tbody .tr .th { width:initial; padding:10px; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:start; }
  */
  .index_table .tbody .tr .th em { margin:0; width:170px; text-align:left; }
  .index_table .tbody .tr .th a { margin:10px; }
  .index_table .tbody .tr .th a.link { margin:0 10px; padding:0; }
  .index_table .tbody .tr .th a.btn1 { margin-left:20px; }
  .index_table .tbody .tr .td { width:initial; }
  .index_table .tbody .tr .td ul { flex-wrap:wrap; justify-content:center; }
  .index_table .tbody .tr .td ul li a { width:70px; max-width:15vw; }
  .option-colors .index_table .tbody .tr .td ul li a { max-width:15vw; }
  .index_table .tbody .tr .td ul li a br { display:none; }
}
@media only screen and (max-width: 767px) {
  .index_table .tbody .tr .td .option { width:100%; }
  .index_table .tbody .tr .td .option > h5 { margin:10px auto 0; width:97%; }
  .index_table .tbody .tr .td .option ul { justify-content:space-evenly; }
  .index_table .tbody .tr .td .option-info { padding-top:0; }
  .index_table .tbody .tr .td .option-info ul { padding:10px 0; }
  .index_table .tbody .tr .td .option-info ul li { padding:0; }
  .index_table .tbody .tr .td .option-info ul li a { max-width:30vw; width:initial; margin:0; }
}
@media only screen and (max-width:550px) {
  .index_table .tbody .tr .th { align-items:start; }
  .index_table .tbody .tr .th em { width:90%; }
}
@media only screen and (max-width:450px) {
  .index_table .tbody .tr .th { flex-direction:column; }
  .index_table .tbody .tr .th em { margin-bottom:10px; }
  .index_table .tbody .tr .th a.btn1 { margin-top:5px; }
}



/* ------------------------------------

  上部固定メニュー
------------------------------------ */
/* #header_menu */
#header_menu { z-index:999; position:fixed; top:-110px; left:0; width:100%; background:#fff; box-shadow:0 3px 3px rgba(0,0,0,.2); 
  transition:.2s; }
  .header_menu_inner { width:min(1050px,99vw); height:min(90px,17vw);
    margin:0 auto; padding-top:5px; position: relative;
    display:flex; align-items:flex-end; 
    font-family:"Zen Maru Gothic", sans-serif; font-weight:500; text-align:center; }
  body.mvout #header_menu { top:0; }

#header_menu .logo { width:min(80px,9vw); min-width:60px; height:100%; padding:0 5px; text-align:center;  
    display:flex; align-items:flex-start; height:min(85px,16vw);
}
#header_menu .logo img { width:100%; height:auto; display:block; margin:0 auto; }

#header_menu .feature { display:flex; justify-content:center; align-items:flex-end; text-align:center; width:min(290px,29vw); min-width:165px; }
#header_menu .feature .badge { width:33%; display:block; text-decoration:none; padding:0 0 1.2em; }
#header_menu .feature .badge img { display:block; margin:auto; width:70%; min-width:45px; transition:transform .2s; }
#header_menu .feature .badge:hover img { transform:translateY(-1px);}
#header_menu .feature .badge h5 { position:absolute; bottom:3px; left:-50px; right:-50px; margin:0; 
  /*width:min(10em,8vw);*/ min-width:5em;
  line-height:1; font-weight:800; font-size:min(1.12rem,3vw); margin:0 auto; }
#header_menu .feature .badge h5 br { display:none; }

#header_menu .tr { width:min(110px,15vw); min-width:6em; margin-left:2px; cursor:pointer; }
#header_menu .tr .th { display:flex; align-items:center; justify-content:center; flex-direction:column;
  padding:12px 0; border-radius:6px 6px 0 0; min-width:5.5em;
  color:#135f36; font-weight:600; font-size:min(1.3rem,2vw); white-space: nowrap;
  transition:all .2s;  background:#e8e8e8;  }
  #header_menu .tr:hover .th { background:#f4f4f4; padding:14px 0; }

#header_menu .tr .td { display:none; transition:all .2s; opacity:0; text-align: center;
  position:absolute; left:0; top:100%; width:100%; max-width:1000px; background:#f4f4f4;
  box-shadow:0 3px 3px rgba(0,0,0,.2); }
  #header_menu .tr:hover .td { opacity:1; display:flex; flex-wrap:wrap; justify-content:center; }
  #header_menu .tr:hover .td > div { margin:10px; }
#header_menu .tr .td h5 { font-size:1.2rem; background:#fff; border-radius:10px; max-width:500px; margin:10px auto 0; }
#header_menu .tr .td ul { display:flex; flex-wrap:wrap; justify-content:center; margin:5px auto; }
#header_menu .tr .td ul li { display:block; }
#header_menu .tr .td ul li a { display:block; margin:5px 0; width:90px; 
  text-decoration:none; color:#333; font-size:min(1.15rem,3vw); font-weight:800; text-align:center; line-height:1.1; }
#header_menu .tr .td ul li a img { display:block; margin:0 auto 3px; width:60px; }

#header_menu .menu_sub .menu_sub_list { display:flex; }
#header_menu .menu_sub .menu_sub_h { display:none; }
#header_menu a.item { display:flex; align-items:center;
  padding:5px 10px; margin-left:2px; border-radius:0 5px 0 0; min-height:35px;
  color:#333; font-size:1.1rem; font-weight:600; line-height:1.2;
  transition:.2s;  background-color:#f8f8f8; }
#header_menu a.item:hover { background-color:#e6e6e6; }

#header_menu .contact { position:absolute; top:10px; right:90px; }
#header_menu .contact .btn_link { margin:min(3px,0.05vw); font-size:min(1.3rem,2vw); min-width:min(110px,9vw); }

@media only screen and (max-width:960px) {
  #header_menu .tr .th { padding:5px 0; }
  #header_menu .menu_sub { cursor: pointer; }
  #header_menu .menu_sub .menu_sub_h { display:block; padding:min(10px,1vw); }
  #header_menu .menu_sub .menu_sub_list { display:none; 
    position:absolute; left:0; top:100%; width:100%; background:#f4f4f4; }
    #header_menu .menu_sub:hover .menu_sub_list { display:flex; flex-wrap:wrap; justify-content:center; }
  #header_menu .menu_sub .menu_sub_list a.item { display:block; padding:5px; border-radius:5px; margin:5px 2px; background:#fff; }

  #header_menu .feature .badge { padding-bottom:2em; }
  #header_menu .feature .badge h5 br { display:initial; }

}

@media only screen and (max-width:500px) {
  #header_menu { padding:2px 0 3px; }
  #header_menu .logo { padding:0 0 5px 5px; }
  #header_menu .feature { display:none; }
  #header_menu .tr { display:none; }
  #header_menu .tr .td { display:block; }
  #header_menu .contact {  top:5vw; right:85px; /*max-width:calc(100vw - 235px);*/ }
  #header_menu .contact .btn_link { min-width:8em; font-size:10px; padding:5px 5px 5px 7px; }
  #header_menu .menu_sub .menu_sub_h { display:none; }
}


/* ------------------------------------

  トップページコンテンツ
------------------------------------ */

/* ネームプレート横2つ  */
.name_plate { display:flex; justify-content:space-between; }
.name_plate .col { margin-bottom:40px; display:inline-block; }
.name_plate .col .frm { border:3px solid #056437; border-radius: 5px; display:block; text-align:center; }
.name_plate .col .frm h5 { text-align: center; border: none; margin: 0; padding: 0.5em 0; color:#fff; background-color: #056437; font-size: 1.6rem; font-weight: 800;  }
@media only screen and (min-width:768px) {
  .name_plate .col:first-child { width:50%; }
  .name_plate .col:last-child { width:45%;; }
  .name_plate .col .frm img { width: auto; height:min(230px,20vw); max-width:100%; }
}
@media only screen and (max-width:767px) {
  .name_plate { flex-wrap:wrap; }
  .name_plate .col { margin-bottom:20px; width:100%; }
  .name_plate .col:first-child { margin-right: 0px; }
  .name_plate .col .frm img { max-width: 100%; max-height: inherit; }
}