@charset "UTF-8";

/*** ここからトップの記述 ***/
#web_point{ position: absolute; margin-top: -50px;}
.web_title{ font-size: 26px; padding: 8px 0 12px; font-weight: lighter; background-color: #073E82; width: 596px; margin: auto; color: #FFF; text-align: center; margin-top: 120px;}
.pan_title{ font-size: 26px; padding: 8px 0 12px; font-weight: lighter; background-color: #056B57; width: 596px; margin: auto; color: #FFF; text-align: center; margin-top: 40px;}

.web_01{width: 324px; margin: auto;}
.web_02{width: 596px; margin: auto;}

#web{ width: 100%;  height: auto; position: relative; min-height: 720px;}
.web_left{ position: fixed; width: 460px;  height: 100vh; min-height: 720px;
  background-image: url("../img/index/gaiyou_bg.png"); background-size: 100% 100%; background-position: center center;}
.web_left section{ position: absolute; width: 360px; padding: 50px; height: 160px; top: calc(50% - 105px); color: #FFF;}
.web_left section h2{ position: relative; font-size: 32px; text-align: center; letter-spacing: 2.2px; font-weight: lighter;}
.web_left section p{ position: relative; font-size:32px;
  margin-top: 20px; line-height: 36px; letter-spacing: 1px; padding: 10px 0;
 background-image: url("../img/web/award.png"); background-size: contain; background-position: center center; background-repeat: no-repeat; text-align: center;}

.web_right{ position: relative; right: 0; float: right; width: calc(100% - 460px); height: auto; min-height: 720px;
  background-image: url("../img/web/linen_bg.jpg"); background-size: cover; background-position: center left; background-attachment: fixed;}
.web_right img{ display: block; position: relative; width: 100%; max-width: 724px; margin: auto; top: calc(50% - 310px); left: 0; right: 0;}
.image{ position: absolute; display: block; right: 4px; bottom: 4px; text-align: left; font-size: 10px; color: #FFF;}

.web_table{ width: 596px; margin: auto;}
.web_table tr th{ background-color: #063570; padding: 6px 6px 10px; text-align: center; color: #FFF; width: 180px;
  font-size: 18px; line-height: 18px; vertical-align: middle; font-weight: lighter !important;
  border-right: 5px solid #FFF; border-bottom: 5px solid #FFF;}
.web_table tr td{ background-color: #E6E6E6; padding: 12px 18px; font-size: 14px; border-bottom: 5px solid #FFF;}
.web_table tr td h4{ font-size: 16px;}
.web_table tr td h4 small{ font-weight: lighter;}

.pan_table tr th{ background-color: #075E4F;}

  .footer_tel{ padding-top: 20px; padding-bottom: 10px;}
  .footer_tel img{ width: 400px;}
.explain{ font-size: 10px;}
/*** ここからレスポンシブの記述 ***/



@media screen and (max-width: 1200px) {
#web{ min-height:100px;  height: auto;}
.web_title{margin-top: 30px;}

.web_left{ position: relative; left: 0; width: 100%; height: 200px; min-height: 100px; z-index: 50;}
.web_left section{ position: absolute; width: 100%; padding: 0px; height: 280px; top: 0; color: #FFF;}
.web_left section h2{  padding-top: 70px;}
.web_left section p{ margin: 0 30px;}
  
.web_right{ position: relative; left: 0px; top: 0px; width: 100%; height: auto; min-height: 100px; background-position: center center; padding: 2% 0 2%;}

.web_right img{ position: relative;}
  
footer{ padding: 8px 0;}
footer p:nth-child(2){ position: relative; width: 100%; text-align: center; bottom: 0; right: auto; left: auto; margin: auto;}


.image{ position: absolute; display: block; right: 4px; bottom: 4px; text-align: right; font-size: 10px; color: #FFF;}

#konyu_point{ position: absolute; margin-top: -50px;}



}

@media screen and (max-width: 800px) {
#web{ min-height:100px;  height: auto;}
  
.web_02{width: 94%; margin: auto;}
  
.web_title{ width: 100%; font-size: 5.6vw;  margin-top: 6%;}
.pan_title{ width: 100%; font-size: 5.6vw;  margin-top: 2%;}

.web_left{ position: relative; left: 0; width: 100%; height: calc(29vw + 105px); min-height: 100px; z-index: 50;}
.web_left section{ position: absolute; width: 100%; padding: 0px; top: 0; color: #FFF;}
.web_left section h2{ font-size: 8vw; text-align: center; padding-top: 70px; line-height: 16vw;}
.web_left section p{ font-size: 6vw;line-height: 9vw; margin: 0 30px;}

.web_table{ width: 94%; margin: auto;}
.web_table tr th{ width: 100%; display: block; margin-top: 5px; padding: 8px 0; box-sizing: border-box; border: none;}
.web_table tr td{ width: 100%; display: block; box-sizing: border-box; padding: 6px 9px;}
  
.web_right{ position: relative; left: 0px; top: 0px; width: 100%; height: auto; min-height: 100px; background-position: center center; padding: 2% 0 6%;}

.web_right img{ position: relative;}
  
footer{ padding: 8px 0;}
footer p:nth-child(2){ position: relative; width: 100%; text-align: center; bottom: 0; right: auto; left: auto; margin: auto;}


.image{ position: absolute; display: block; right: 4px; bottom: 4px; text-align: right; font-size: 10px; margin-top: 30px;}

#konyu_point{ position: absolute; margin-top: -50px;}

  footer{ margin-top: 20px;}
  
  .footer_tel img{ width: 96%; text-align: center;}

}