@charset "utf-8";
/* CSS Document */

*{margin:0; padding:0; border:0; font-feature-settings: "palt"; font-size:100%;}
*, *:before, *:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;}/* 超大事 */

body{font-size:100%; line-height:180%; word-wrap:break-word; background:#fff; -webkit-text-size-adjust : 100%!important ; font-family: "Helvetica Neue",Arial;}
#wapper{width:100%; display:block; box-sizing:padding-box;}
#footend{text-align: center;}

/* clearfix */
.clearfix {width:100%;}
.clearfix::after {content: ""; display: table; clear: both;}
.clearfix:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.clearfix {min-height: 1px;}
* html .clearfix {height: 1px;}

img{width: 100%;}

/* マージン管理 */
.mb1{margin-bottom: 1em;}
.mb2{margin-bottom: 2em;}
.mb3{margin-bottom: 3em;}
.mb4{margin-bottom: 4em;}
.mb5{margin-bottom: 5em;}
.mb6{margin-bottom: 6em;}

hr.h2img {
/*
  border: 0;
  height: 5px;
  border-image: url("../img/h2_line.png") 30 round;
  border-style: solid;
    */
  border: 0;
  height: 8px;
  background-image: url("../img/h2_line.png");
  background-repeat: repeat-x;
  background-position: center;
  background-size: auto;    
}

/* タグ管理 */
h1{margin-bottom: 1em; font-size: 2.0em; line-height: 1.4em;}
h2{margin-bottom: 1em; font-size: 1.4em; line-height: 1.6em;}
h3{margin-bottom: 1em; font-size:1.2em; line-height: 1.2em;}
h4{margin-bottom: 1em;}
h5{margin-bottom: 1em;}
small{font-size:0.8em;}
section{margin-bottom: 10em;}

.center{text-align: center;}
a.switch{display: block; padding: 1em; font-size:1.3em; font-weight: bold; text-align: center; text-decoration: none; background: linear-gradient(0deg, #316745, #a9cc51); color:#fff; border-radius: 10px;}
a:hover.switch{display: block; padding: 1em; text-align: center; opacity:0.5;}
a.foot{color:#fff;}
a:hover.foot{text-decoration:none; color:#fff;}
dl{margin: 0; padding: 0;}
dt{width: 50%; float: left; overflow: hidden;}
dd{width: 50%;}

.bt{border-top: 1px solid #ccc;}
.bb{border-bottom: 1px solid #ccc;}
.cardimg{border: 1px solid #eee; padding: 1em;}

/* タイムラインのテーブル */
.table_box {overflow-x: auto; display: block; margin: auto;}
.table_box table th,.table_box table td {white-space: nowrap;}
.table_box table{width: 100%; border-collapse: collapse; margin-bottom: 1em;}
.table_box table th,.table_box table td{border-bottom:1px solid #ccc; border-right:1px solid #ccc; padding: 0.5em 1em;}
.table_box table th{text-align: left;}
.table_box table td{text-align: center;}

/* 購入ボタン画面固定 */
.bottom-action{
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(0px + env(safe-area-inset-bottom));
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 16px;
  background: linear-gradient(0deg,#316745,#a9cc51);
  color: #fff;
  text-decoration: none;
  z-index: 1200;
  box-shadow: 0 -6px 18px rgba(0,0,0,0.12);
  font-weight: 600;
}

/* 入力フォーム */
    table.input_personal{width: 100%; margin-bottom: 3em; border-collapse: collapse;}
    table.input_personal input,textarea{margin: 0; width: 100%; border:1px solid #eee; padding: 0.5em;}
    table.input_personal select{border: 1px solid #ccc;}
    /* table.input_personal input{width: 100%;} */
    table.input_personal th,table.input_personal td{padding: 0.3em;}
    table.input_personal th{text-align: left; width: 9em;}
    table.input_personal td{text-align: left;}
    table.input_personal h4{border-bottom: 2px solid #999;}
    table.input_personal input:focus {outline: 1px /*#cfe6e6*/ #008b8b solid; background:#e4ffff; }
    table.input_personal input.submit {display:block; cursor: pointer;}





/* ここからはブラウザの区分 */

/* phone */
@media screen and (max-device-width: 640px) { 

.pc{display:none;}

/* img{width:100%; max-width:100%; height:auto;} */
    
header{margin: 0;}
#haedarea{margin:0.5em 0.5em; }
#contents{width:100%; background:#fff;}

#container{max-width:100%;}
#containerarea{display:block; padding:1em; padding-top:0em; }
footer{background:#2b2b2b; background:#000; background: #292929; color:#fff;}
#footarea{padding:3em;}
.foot_info{font-size: 100%; }

/* 購入ボタン画面固定 */
.bottom-action__label{ font-size: 16px; }
.bottom-action__price{ font-size: 16px; opacity: .95; }

    
/* カラム管理 */
ul.one-column,ul.two-column,ul.three-column,ul.four-column,ul.five-column{margin: 0; padding: 0; width: 100%;}
ul.one-column li,ul.two-column li,ul.three-column li,ul.four-column li,ul.five-column li{padding: 2em; list-style: none; overflow: hidden; float: left;}

ul.one-column{}
ul.one-column li{width: 100%;}
ul.two-column{}
ul.two-column li{width: 100%;}
ul.three-column{}
ul.three-column li{width: 100%;}
ul.four-column{}
ul.four-column li{width: 100%;}
ul.five-column{}
ul.five-column li{width: 100%;}
    
}/* /phone */


/* PC */
@media screen and (min-width: 641px) { 

.phone{display:none;}

header{}
#headarea{max-width:80%; margin: auto;}
#contents{width:1300px; margin:0 auto; background:#fff;}

#container{width:1300px; float:left;}
#containerarea{display:block; padding:1em; padding-top:0em;}

footer{background:#2b2b2b; background:#000;  background: #292929; color:#fff;}
#footarea{width:1300px; margin:0 auto; color:#fff; padding:3em;}
#foot_link{display: table; table-layout: fixed; text-align: center; width: 75%; border-collapse:collapse;}
#foot_link li{list-style: none; display: table-cell; vertical-align: middle; text-align: right; padding-right: 1em; line-height: 150%; }
#foot_link li:last-child{text-align: left; margin-right: 0;}

/* 購入ボタン画面固定 */
.bottom-action{
    left: 50%;
    transform: translateX(-50%);
    width: min(720px, 90%);
    border-radius: 12px 12px 0 0;
}

/* カラム管理 */
ul.one-column,ul.two-column,ul.three-column,ul.four-column,ul.five-column{margin: 0; padding: 0; width: 100%; overflow: hidden; float: left;}
ul.one-column li,ul.two-column li,ul.three-column li,ul.four-column li,ul.five-column li{padding: 2em; list-style: none; overflow: hidden; float: left;}

ul.one-column{}
ul.one-column li{width: 100%;}
ul.two-column{}
ul.two-column li{width: 50%;}
ul.three-column{}
ul.three-column li{width: 33.3%;}
ul.four-column{}
ul.four-column li{width: 25%;}
ul.five-column{}
ul.five-column li{width: 20%;}
    
}/* /pc */


/* ===== ヘッダー画像の余白ゼロ & レスポンシブ ===== */
#mainVisual {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0;              /* 画像下の隙間を完全に消す */
}

#mainVisual img {
    display: block;              /* 画像下の隙間対策 */
    width: 100%;                 /* 横幅いっぱいに広げる */
    height: auto;                /* 縦は自動で維持 */
    margin: 0;
    padding: 0;
}

@media screen and (max-width: 768px) {
    h1 {
        font-size: 1.6em;
        line-height: 1.4em;
    }
}