@charset "utf-8";

html,body {
  color: #000;
  font-family:  "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
  font-weight: 500;
  font-style: normal;
  letter-spacing: 0;
}

@media screen and (max-width: 768px) {
  html,body {
    font-size:3.5vw;
    line-height: 1.7;
  }
}
body {
	-webkit-font-smoothing: antialiased;
}

a:hover img{
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
a{
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
	text-decoration: none;
}

a {color: #810000; text-decoration: none;}
a:hover {color: #ccc;}

img{
	line-height: 0;
	vertical-align: bottom;
  max-width: 100%;
}

.dflex{
  display:-webkit-box;
  display:-moz-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
}
.wrap{flex-wrap:wrap;}
.flex-start{justify-content: flex-start;}
.flex-end{justify-content: flex-end;}
.j-center{justify-content: center;}

.animated.lowspeed{
	-webkit-animation-duration: 3s;
	animation-duration: 3s;
}
.object-fit-img{
    object-fit: cover;
    font-family: 'object-fit:cover;'
}
.scroll-fadein {
	opacity : 0;
	transform: translateY(40px);
	transition: all 2s;
}

.wf-jp-min{
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
  font-weight: bold;
}

.inner{margin-right: 3%; margin-left: 3%;}
.inner_min{margin-right: 6%; margin-left: 6%;}
article{margin-bottom: 60px;}
article.nomb{margin-bottom: 0px;}

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

header

---------*/
header.index{background-color: #00a63c;}
header.index::after{
  content: "";
  background-image: url(../images/index/img_foot_header.jpg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center bottom;
  display: block;
  padding-bottom: 10%;
}

header.index .main_img{
  background-image: url(../images/index/main_bg.jpg);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
}

header.index p.head_text{
  padding:5% 5% 4% 5%;
  text-decoration: underline;
}
header.index h1{padding: 0 15% 0 2%;}

.main_present{padding: 0 5% 5% 5%;}

.main_present h2{
  margin-top:-20%;
  position: relative;
}
p.linkbtn a{
  display: block;
  background-image: url(../images/index/icon_arrow.png);
  background-repeat: no-repeat;
  background-position: 96% center;
  background-size: 15px;
  background-color: #ff0000;
  /*border: 1px solid #ff0000;*/
  border-radius: 8px;
  color: #fff;
  padding: 4% 5%;
  width: 90%;
  margin: 15px auto 0;
  text-align: center;
  font-size: 4vw;
  font-weight: bold;
}
p.linkbtn a:hover{
  background-color: #fff;
  color: #ff0000;
}

p.linkbtn.line a{
  display: block;
  background-image: url(../images/index/icon_line002.png),url(../images/index/icon_arrow002.png);
  background-repeat: no-repeat,no-repeat;
  background-position: 5% center, 96% center;
  background-size:auto 80%, 15px;
  background-color: #fcee21;
  /*border: 1px solid #fff;*/
  border-radius: 8px;
  color: #000;
  padding: 4% 5% 4% 10%;
  box-sizing: border-box;
  width: 100%;
  margin: 15px auto 0;
  text-align: center;
  font-size: 3.5vw;
  font-weight: bold;
}
p.linkbtn.line a:hover{
  background-color: #ffff00;
  color: #00a63c;
}


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

index

---------*/

.message{
  padding: 6% 7% 0;
}
.message section{margin-bottom: 8%;}

.message section h2,
.message section h3{
  color:#ff0000;
  font-size: 4.2vw;
  margin-bottom: 30px;
}
.message section p{
  margin-bottom: 30px;
  font-size: 3.6vw;
  line-height: 2.2;
}


.point{
  background-color:#ffff00;
  padding:5% 3%;
}
.point h2{margin:0 10% 30px;}
.point ol li{margin-bottom: 10px; font-weight: bold;}
.point ol li span,
.red{color: #ff0000;}

.center_text{
  text-align: center;
  font-size: 4vw;
  line-height: 2.2;
}

.icon_arrow{
  text-align: center;
  width: 8%;
  margin: 30px auto 0;
}

.ttl_box{
  color: #fff;
  font-size: 6vw;
  font-weight: bold;
  text-align: center;
  padding: 6% 2%;
  margin-bottom: 40px;
}
.ttl_box.green{background-color: #00a99d;}
.ttl_box.red{background-color: #ff0000;}

.fb_txt{
  font-weight: bold;
  line-height: 2.2;
}

.merit{
  background-color:#f3f3f3;
  padding-bottom: 6%;
}

.merit h2{margin: 30px 10% 30px;}
.merit section {margin:0 4% 40px; font-weight: bold;}
.merit section h3{
  color: #00a99d;
  font-size: 6.5vw;
  margin-bottom: 10px;
}

.siyou h2{
  margin: 0 6% 30px;
}
.bg_green{
  background-color: #00a99d;
  padding: 5%;
}
.open_menu section{background-color: #fff;}
.open_menu section:nth-child(n+2){margin-top: 4%;}

.open_menu section .open_btn{
  cursor: pointer;
  padding: 5% 3%;
  background-image: url(../images/index/icon_open.png);
  background-position: 96% center;
  background-repeat: no-repeat;
  background-size: 16px;
}
.open_menu section .open_btn.active{
  background-image: url(../images/index/icon_close.png);
}
.open_menu section .open_btn h3{
  color:#00a99d;
  font-weight: bold;
  font-size: 5vw;
}
.open_menu section .open_btn h3 span{font-size: 2vw;}
.open_menu section .open_btn p{
  font-size: 3vw;
}

.open_menu section .open_box{padding: 4%; border-top: 1px dotted #ccc; display: none;}
.open_menu section .open_box h4{margin-bottom: 24px;}

.bg_yellow{
  background-color: #ffff00;
  text-align: center;
  padding: 5% 6%;
}
.yamada{
  background-image: url(../images/index/bg_yamada.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 8% 0;
}
.yamada h3{
  text-align: center;
  margin: 0 5% 30px;
}
.yamada .red{font-size: 5vw;}
.min_text{font-size: 2.4vw; margin-top: 20px;}

.oubo{
  background-image: url(../images/index/img_foot.jpg);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center bottom;
  display: block;
  padding-bottom: 10%;
}
.oubo p a{
  display: block;
  background-color: #00a63c;
  text-align: center;
  padding: 5% 6%;
}

.takai section{
  margin-bottom: 60px;
}
.takai section h3{
  color: #ff0000;
  font-size: 5.5vw;
  line-height: 1.7;
  margin-bottom: 10px;
}
.takai section .white_box{
  background-color: #fff
}
.takai section p span,
.habuku section .white_box p span{
  background-color: #ffff00;
}

.habuku section{
  background-color: #ff0000;
  padding: 5% 3%;
  margin-bottom: 60px;
}
.habuku section h2{
  text-align: center;
  margin: 0 10% 20px 0;
}
.habuku section .white_box{
  background-color: #fff;
  padding: 4%;
}


.uketoru h2{
  text-align: center;
  margin: 0 10% 5%;
}
.uketoru .fb_text{
  margin: 30px 10% 0;
  font-size: 4vw;
  font-weight: bold;
}
.more_box{
  background-color: #00a99d;
  background-image: url(../images/index/icon_sankaku.png);
  background-position: center top;
  background-size: 30px;
  background-repeat: no-repeat;
  padding: 10% 3% 4%;
}

.more_box section{margin-bottom: 30px;}
.more_box section h3{
  text-align: center;
  background-color: #ffff00;
  padding: 3% 2%;
  font-weight: bold;
  font-size: 5vw;
  margin-bottom: 20px;
}

.more_box p.open_btn{
  text-align: center;
  color: #fff;
  font-weight: bold;
  font-size: 4vw;
  margin: 10px auto 20px;
  border-bottom: 2px solid #c7ece9;
  padding-bottom: 5px;
  width: 30%;
}
.more_box p.open_btn span::before{
  content: "+";
  padding-right: 5px;
}
.more_box p.open_btn.active span::before{content: "-";}
.more_box .more_text{
  display: none;
  background-color: #fff;
  padding: 5%;
}

.koukin h2{
  margin: 40px 0 30px;
}
.koukin section p{
  font-weight: bold;
  font-size: 4vw;
  line-height: 1.8;
  margin-bottom: 26px;
}
.koukin section p span{
  font-size: 5vw;
  color: #ff0000;
}

.matome{
  background-image: url(../images/index/bg_sikaku.png);
  background-position: center bottom;
  padding: 20% 12% 8%;
  text-align: center;
}

.matome h3{margin:32px 0 40px;}
.matome ul li{margin-left: 8%; margin-right: 8%;}
.matome ul li:nth-child(n+2){margin-top: 26px;}

.watasi h2{
  margin: 40px 0 30px;
  color:#00a99d;
  font-size: 7vw;
  font-weight: bold;
  line-height: 1.6;
}

.under_logo{
  width: 36%;
  margin: 0 auto 24px;
  text-align: center;
}
.under_list h3{
  text-align: center;
  color: #00a99d;
  font-size: 7vw;
  margin-bottom: 24px;
}
.tableunit table{width: 100%; border-top: 1px dotted #00a99d;}
.tableunit table tr{border-bottom: 1px dotted #00a99d;}
.tableunit table tr th,
.tableunit table tr td{
  padding: 5% 1%;
  box-sizing: border-box;
  font-size: 3vw;
}
.tableunit table tr th{width:36%; text-align: left; color:#00a99d;}
.tableunit table tr td ol li{
  list-style: decimal;
  margin: 0 0 10px 15px;
}
.tableunit table tr td ul li{
  list-style: disc;
  margin: 0 0 10px 15px;
}
.tableunit table tr td p.caption{
  font-size: 2.3vw;
}

.underimg {margin-top: 30px;}

.ggmap{margin-bottom: 30px;}
.ggmap iframe{width: 100%;}


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

contact

---------*/
.contact_main{
  text-align: center;
  padding: 10% 0 0;
}
.contact_main .c_logo{
  width: 30%;
  margin: 0 auto 20px;
}
.contact_main .c_img{
  margin: 10px 5% 24px;
}

.contact_head h2{
  text-align: center;
  font-weight: bold;
  font-size: 5vw;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 3% 0;
  margin-bottom: 30px;
}
.contact_head section{
  margin-bottom: 40px;
}
.contact_head section h3{
  font-weight: bold;
  font-size: 4vw;
  margin-bottom: 12px;
}
.contact_head section ol li{
  list-style: decimal;
  margin: 0 0 10px 15px;
}
.contact_head section ul li{
  list-style: disc;
  margin: 0 0 10px 15px;
}
.contact_head section p.caption{
  font-size: 2.3vw;
}
.contact_head section p.red{font-weight: bold;}

.mailform table{width: 100%;}
.mailform table tr{
  border-top: 1px solid #ccc;
}
.mailform table tr th,
.mailform table tr td{
  display: block;
  width: 100%;
  padding: 4% 2%;
  box-sizing: border-box;
}
.mailform table tr th{text-align: left; padding-bottom: 0; font-weight: bold;}
.mailform table tr th span{
  display: inline-block;
  color: #ff0000;
  font-size: 2.8vw;
  vertical-align: middle;
  margin-left: 3%;
}
.mailform table tr td ul{
  display: flex;
  justify-content: space-between;
  box-sizing: border-box;
}
.mailform table tr td ul li{
  width: 48%;
  box-sizing: border-box;
}
.mailform table tr td input{
  padding:5% 2%;
  width: 100%;
  box-sizing: border-box;
}
.mailform table tr td input:nth-child(n+2){margin-top: 12px;}

.mailform table tr td select{
  padding:5% 2%;
  width: 80%;
  box-sizing: border-box;
}

.mailform table tr td.radio input,
.mailform table tr td.check input{
  width: auto;
  padding: 0;
}
.mailform table tr td.radio label,
.mailform table tr td.check label{
  display: block;
  margin-bottom: 12px;
}

.mailform table tr td p.red{margin-top: 6px;}

.policy{
  background-color: #f3f3f3;
  padding: 5%;
  margin-bottom: 30px;
}
.policy h3{
  text-align: center;
  font-size: 4vw;
  margin-bottom: 20px;
  font-weight: bold;
}

.policy p.policy_head{
  border-bottom: 2px solid #666;
  padding-bottom: 20px;
  margin-bottom: 20px;
}

.policy div:nth-child(n+2){margin-top: 24px;}
.policy div h4{font-weight: bold; margin-bottom: 8px;}

.policy div ul li{
  list-style: disc;
  margin: 0 0 12px 20px;
}

.policy_btn{
  margin: 50px 0;
}

#submitbtn{
  text-align: center;
}
#submitbtn .submit{
  width: 90%;
  margin: 0 auto;
  color: #fff;
  cursor: pointer;
  background-image: url(../images/index/icon_arrow.png);
  background-position: 96% center;
  background-repeat: no-repeat;
  background-size: 18px;
  background-color: #00a99d;
  border: 1px solid #00a99d;
  border-radius: 6px;
  padding: 4% 0;
  box-sizing: border-box;
  text-align: center;
  font-size: 4vw;
}


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

footer

---------*/

footer{
  background-color: #f3f3f3;
  text-align: center;
  color: #333;
  padding: 6% 2% 18%;
}

footer h4{
  width: 40%;
  margin: 0 auto 20px;
}

footer p.copy{font-size: 2vw;}

.foot_bnr{
  background-color: #fff;
  box-sizing: border-box;
  position: fixed;
  bottom: 0;
}
.foot_bnr p a{
  display: block;
  padding:2%;
}

@media screen and (min-width: 768px) {
  html,body{
    max-width: 600px;
    margin: 0 auto;
    font-size: 16px;
  }
  .message section h2,
  .message section h3,
  .center_text,
  .ttl_box,
  .merit section h3,
  .open_menu section .open_btn h3,
  .takai section h3,
  .more_box section h3,
  .yamada .red,
  .koukin section p span,
  .watasi h2,
  .under_list h3{
    font-size: 16px;
  }

  .message section p,
  .open_menu section .open_btn p,
  .min_text,
  .tableunit table tr td p.caption,
  .contact_head section p.caption,
  .mailform table tr th span,
  .more_box p.open_btn,
  .uketoru .fb_text,
  .koukin section p,
  .tableunit table tr th,
  .tableunit table tr td,
  .contact_head section h3{
    font-size: 14px;
  }

  .contact_head h2,
  .policy h3,
  #submitbtn .submit{
    font-size: 16px;
  }

  footer p.copy{font-size: 12px;}

}
