/*
Theme Name: okinawa-kenkousauna SP3
Theme URI: http://biz-plus.co.jp/
Description: 
Version: 3.7.1-sp3
Author: biz-plus
Author URI: http://biz-plus.co.jp/
*/
body{
background-attachment: fixed;
background-color: #ffffff;
background-image: url("../../../img/bg.jpg");
background-position:center;
background-repeat:no-repeat;
border-top:solid 10px #C2986D;
color:#101010; 
font-size: 14px;
height: 100%;
margin: 0;
width: 100%;
}
.clear{
clear:both;
}
img{
border:none;
}

p{
margin:0;
}
p a{
text-decoration:none;
}
li{
list-style:none;
}
h3{
font-weight:bold;
}
#page{
background-color: #fff; 
margin:0 auto;
position: relative; 
width:980px;
}

#page::after {
  position: absolute; 
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -1;
  content: '';
  box-shadow: 0 0 10px rgba(0,0,0,.5);
}

#page_2{

}

/* HEADER */
#siteheader{
/*height:455px;*/
}
#head1{
height:100px;
line-height:150%;
}
#top-head{
font-size:12px;
font-weight:normal;
margin:0;
}
#head-left{
height:100px;
margin-left:10px;
width:570px;
float:left;
}
.head-left2{
float:left;
margin-top:5px;
}
#logo-l{
float:left;
margin:5px 15px 0 10px;
}
#site-description{
font-size:10px;
font-weight:normal;
margin:5px 0 0 10px;
}
#logo{
margin:0;
padding:0;
}
#head-right{
float:right;
text-align:right;
margin:20px 20px 0 0;
}
#head-right a{
text-decoration:none;
}
.head-member{
background-color:#008B3A;
color:#ffffff;
text-align:center;
padding:3px 0;
width:150px;
margin-left:200px;
}

.head-menuarea{
height:45px;
}

#main-nav {
  background-color: #970d0d; 
  display:-webkit-box; 
  display:-webkit-flex; 
  display: -ms-flexbox; 
  display: flex; 
  flex-direction: row; 
  -webkit-justify-content: space-between; 
  justify-content: space-between; 
  -ms-flex-pack: space-between;
  margin: 0; 
  overflow: hidden; 
  padding: 0; 
}

#main-nav li{
text-align:center;
background-image:url("../../../img/icon_2.png");
background-repeat:no-repeat;
background-position:0 50%;
min-width:16%;
}

#main-nav li a{
color: #fff; 
display:block;
padding:0 25px;
line-height:46px;
font-size:15px;
/*width:90px;*/
text-align:center;
text-decoration:none;
vertical-align:top;
}

#main-nav li .sub-menu {
  display: none; 
  padding: 0 10px; 
  position: absolute; 
  z-index: 999; 
}

#main-nav li .sub-menu li {
  background-image: none; 
  border-bottom: 1px solid #fff; 
  float: none; 
  line-height: 50px; 
}

#main-nav li .sub-menu .menu-item {
  background-color: #00b05a;
  text-align: left; 
} 

#main-nav li .sub-menu .menu-item a:hover {
  background-color: #19be6e; 
}

#main-nav li .sub-menu li a {
  color: #fff; 
}

#main-nav li:hover .sub-menu {
  display: block; 
}

.head-menu{
color:#ffffff;
float:left;
font-weight:bold;
padding-right:1px;
height:45px;
}

.head-slide{
width:980px;
height:315px;
overflow:hidden;
text-align:center;
}
#top-head2{
font-size:12px;
font-weight:normal;
margin:0;
}
#eyecatche{
overflow:hidden;
width:980px;
height:150px;
}

/* CONTENTS */
.wrapper{
background-color:#ffffff;
padding:20px 15px 150px 10px;
height:100%;
}
.wrapper_2{
background-color:#ffffff;
padding:20px 15px 150px 10px;
height:100%;
}
#main{
width:700px;
float:right;
line-height:150%;
}
.news-area{
height:270px;
width:690px;
margin-bottom:20px;
background-image:url(../../../img/infobanner.jpg);
background-repeat:no-repeat;
}
.newsbox{
border:1px solid #A27C52;
height:250px;
}
.newsbox2{
overflow-y:scroll;
padding:10px 15px;
margin-top:40px;
height:190px;
}
h3.newstitle{
text-align:left;
color:#000000;
background-image:none;
line-height:18px;
height:18px;
font-size:15px;
font-weight:normal;
margin: 0; 
}
.table1{
width:100%;
color:#000000;
border-bottom:1px solid #A27C52;
}
.tr1{

}
.td1{
border:none;
}
.td1-l{
width:130px;
}
.td1-r{
}
.td1-r a{
font-weight:bold;
color:#000000;
text-decoration:none;
}
ul.ul1{
margin:0;
padding:0;
}
.li1{
list-style-image:url(../../../img/icon1.png);
line-height:15px;
vertical-align:middle;
list-style-position:inside;
}

.date {
  display: block; 
  overflow: hidden; 
}

.date::before {
  content:url(../../../img/icon1.png); 
  display: block; 
  float: left; 
  margin: 0 7px 0 0; 
}


h2.title_t{
background-image:url(../../../img/title_b.jpg);
background-repeat:no-repeat;
width:690px;
height:50px;
margin:0 0 20px 0;
color:#603813;
line-height:55px;
padding-left:30px;
font-weight:normal;
font-size:22px;
}
.content{
padding:5px 10px;
}

h3.content_t{
background-image:url(../../../img/title_b2.jpg);
background-repeat:no-repeat;
max-width:660px;
height:40px;
padding-left:30px;
color:#000;
font-size:20px;
text-align:left;
line-height:45px;
margin-bottom:10px;
}

h3.blog-t{
background-image:url(../../../img/event_b.jpg);
background-repeat:no-repeat;
line-height:40px;
font-size:18px;
color:#ffffff;
padding-left:25px;
margin:0 0 10px;
width:660px;
text-align:left;
}
h4.content_t2{
background-image:url(../../../img/title_b3.jpg);
background-repeat:no-repeat;
height:90px;
width:570px;
line-height:90px;
margin:0 0 15px 0;
padding:10px 0 0 85px;
font-size:20px;
}
h4.blog-t{
background-image:url(../../../img/event_b.jpg);
background-repeat:no-repeat;
line-height:40px;
font-size:18px;
color:#ffffff;
padding-left:25px;
margin:20px auto 10px;
width:660px;
}

h3.content_t3{
  border-top: 7px double #a17c50; 
  border-bottom: 1px solid #a17c50; 
  color:#ff8000; 
  line-height: 30px; 
  padding: 5px 0 0; 
  position: relative; 
  overflow: hidden; 
}

.content_t3::before {
  content: url(../../../img/icon3.png); 
  display: block; 
  float: left; 
  margin: 0 7px 0 0; 
}

h3.content_t4{
  border-top: 7px double #a17c50; 
  border-bottom: 1px solid #a17c50; 
  color:#ff8000; 
  line-height: 30px; 
  padding: 0 0 3px; 
  position: relative; 
  overflow: hidden; 
}

h3.content_t4 span{

}

.content_t4::before {
  content: url(../../../img/icon3.png); 
  left: 0; 
  margin: 0 7px 0 0; 
  position: relative; 
  top: 5px; 
  vertical-align: middle; 
}

.content_t4::after {
  content: url(../../../img/icon3.png); 
  margin: 0 0 0 7px; 
  position: relative; 
  top: 5px; 
  vertical-align: middle; 
}

.b-text{
padding:10px;
}
.blog-box{
padding-bottom:20px;
border-bottom:dashed 1px #cf0066;
margin:10px 10px 50px;
}

ul.post-categories{
padding:0 20px 0 0;
text-align:right;
}


.keiro-tbl {
  margin: 0 auto 15px; 
  width: 98%; 
}

.keiro-td1 {
  width: 30%; 
}
.keiro-td1 img {
  width: 100%; 
}

.keiro-td2 {
  vertical-align: top; 
  width: 65%; 
}

.camp-tbl {

}

.camp-td1 {
  text-align: right; 
  vertical-align: bottom; 
}

.camp-td2 {
  text-align: right; 
  vertical-align: bottom; 
}

.relax-menu {
  border: 1px solid #970d0d; 
  padding: 10px; 
}

.relax-box {
  margin: 0 0 10px; 
  overflow: hidden; 
}

.relax-box dl {
  float: left; 
  margin: 10px 0; 
  width: 450px; 
}

.relax-box dt {
  font-size: 20px; 
  font-weight: bold; 
}

.relax-box dt::before {
  content:url(../../../img/icon2.png); 
  display: block; 
  float: left; 
  margin: 0 7px 0 0; 
  position: relative; 
  top: -4px; 
}

.relax-box dl dd {
  margin: 0 0 10px; 
}

.relax-pic {
  float:right; 
  margin: 10px 0 0 0; 
  padding: 10px; 
  width: 180px; 
}

.relax-pic img {
  border-radius: 5px; 
  box-shadow: 0 0 10px rgba(0,0,0,.5); 
  width: 100%; 
}

.relax-box ul {
  padding: 5px 0 0 15px; 
}

.flex-area {
  display:-webkit-box; 
  display:-webkit-flex; 
  display: -ms-flexbox; 
  display: flex; 
  flex-direction: row; 
  -webkit-justify-content: space-between; 
  justify-content: space-between; 
  -ms-flex-pack: space-between;
}

.shisetsu-box {
  overflow: hidden; 
  width:49%; 
}

.shisetsu-box dt,.h4t {
  border-bottom: solid 1px #ff8000; 
  border-left: solid 5px #ff8000; 
  color: #101010; 
  font-size: 16px; 
  font-weight: bold; 
  margin: 0; 
  padding: 2px 5px; 
}

.shisetsu-box dd {
  margin: 0; 
  padding: 5px; 
}

.higawari-box {
  border: 1px solid #70c78a; 
  width: 32%; 
}

.higawari-pic {
  height: auto; 
}

.higawari-pic img {
  width: 100%; 
}

.higawari-box p {
  padding: 5px; 
}


/* 食堂 */

.menu-box {
  width: 48%; 
}

.menu-box table {
  line-height: 180%; 
  margin: 0 0 20px; 
  width: 100%; 
}

.menu-box th {
  background-color:#e9cdab; 
}

.menu-box .td1 {
  border-bottom: 1px dashed #E9CDAB; 
  text-align: top; 
  width: 245px; 
}

.menu-box .td2 {
  border-bottom: 1px dashed #E9CDAB;
  text-align: top; 
}

.nagomi-tel {
  color: #ff0000; 
  font-size: 35px; 
  margin: 10px 0; 
}


/* SIDE MENU */
#side-area{
float:left;
width:230px;
margin-right:10px;
}

.side-menuarea{
margin:10px 0 30px 0;
}
.widget-area ul{
list-style:none;
margin:0;
padding:0;
}
li.widget-container{
list-style:none;
margin:0 0 15px 0;
}
.menu{
background-image:url(../../../img/side_b.jpg);
background-repeat:no-repeat;
height:50px;
padding:0 0 0 30px;
color:#27BA89;
font-size:16px;
font-weight:bold;
margin-bottom:2px;
line-height:55px;
letter-spacing:0.1em;
}
.side-menuarea a{
color: #970d0d; 
display: block; 
margin: 5px 0; 
text-decoration:none;
}
.side-linkarea{
margin:30px 0;
background-color:#EAEAEA;
padding-bottom:10px;
}
.linkarea1{
background-color:#ffffff;
margin:10px;
padding:15px;
}
.linkarea2{
margin-bottom:5px;
}

.fb-page {
  margin: 10px 0; 
}

.side-bana {
  background-image: url(../../../img/nobana.jpg);
  background-repeat: no-repeat; 
  margin: 0 0 5px; 
  padding: 10px 10px 10px 15px; 
  display: table-cell; 
  height: 53px; 
  padding: 0 10px 0 15px; 
  vertical-align: middle; 
  width: 205px; 
}

/* concept */

.concept-img {
  margin: 5px; 
}

.concept-img img {
  border-radius: 50%; 
  box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.3); 
  -moz-box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.3); 
  -webkit-box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.3); 
  -o-box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.3); 
  -ms-box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.3); 
  width: 100%; 
}



/* FOOTER */
#footer{
width:100%;
height:100px;
line-height:130%;
}
.footarea{
width:980px;
background-color:#ffffff;
margin:0 auto;
height:100%;
}
.retop{
text-align:right;
padding-right:20px;
border-bottom:solid 3px #0071B3;
height:70px;
}

.copy{
text-align:center;
background-color:#C2986D;
color:#ffffff;
font-size:14px;
padding:10px;
}






/* お問合せ */
.table2{
margin-top:30px;
width:100%;
}
.tr2{
}
.td2{
border:none;
vertical-align:top;
}
.contact-area{
width:600px;
margin:20px auto;
}
.contact{
width:100%;
border-collapse:collapse;
}
.td-con1{
width:35%;
padding:15px 0 15px 15px;
background-color:#DDE4FF;
border:1px solid #000000;
}
.td-con2{
width:65%;
padding:15px 0 15px 15px;
border:1px solid #000000;
}





/*  */
.member-box{
border:solid 1px #737373;
width:220px;
}
.m-box1{
background-color:#C3C3C3;
padding:10px 0;
float:left;
text-align:center;
width:90px;
}
.m-box2{
background-color:#ffffff;
padding:10px 0;
float:right;
text-align:center;
width:130px;
}
.table3{
width:100%;
}
.tr3{
}
.td3{
border:none;
width:233px;
}


.title2{
border-bottom:solid 2px #0071B3;
margin:0 0 1px 0;
padding:0 0 2px 2px;
}
.title2_b{
font-size:22px;
border-left:solid 15px #00AAE8;
padding:0 0 0 15px;
}


.table4{
width:100%;
margin-top:30px;
}
.tr4{
}
.td4{
border:none;
width:170px;
padding:10px 0;
}
.member-cate{
background-image:url(../../../img/pic_1.jpg);
background-repeat:no-repeat;
padding-left:25px;
font-size:20px;
}

.archive-date{
border-bottom:solid 1px #cccccc;
margin-bottom:20px;
}
h4.archive_t{
margin:5px 0;
}
.postmetadate{
text-align:right;
padding-right:20px;
}
.single_date{
border-bottom:solid 1px #cccccc;
margin:0 0 10px;
padding:0 0 0 10px;
width:670px;
}
.main-text{

}
#comment{
width:650px;
}

#comments{
text-align:right;
padding-right:20px;
}


/* =========================================================
   スマホ対応（ChatGPT作成）
   PC表示は従来の980px固定を維持し、768px以下のみ調整
========================================================= */
@media screen and (max-width: 768px) {
  html, body {
    width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
    background-image: none !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
  }

  body { border-top-width: 6px !important; }

  * { box-sizing: border-box !important; }

  #page,
  #page_2,
  .wrapper,
  .wrapper_2,
  .footarea,
  #container,
  #contents {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    height: auto !important;
    float: none !important;
  }

  #page::after { box-shadow: none !important; }

  /* ヘッダー */
  #siteheader,
  #head1,
  #head-left,
  #head-right,
  .head-slide,
  #eyecatche {
    width: 100% !important;
    height: auto !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    overflow: hidden !important;
  }

  #head1 { padding: 10px 10px 12px !important; }

  #logo-l,
  .head-left2 {
    float: none !important;
    display: block !important;
    margin: 0 auto 8px !important;
    text-align: center !important;
  }

  #logo-l img { width: 84px !important; max-width: 30% !important; }

  #site-description,
  #top-head,
  #top-head2 {
    margin: 4px 0 8px !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    font-weight: normal !important;
  }

  #logo img {
    width: 94% !important;
    max-width: 520px !important;
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
  }

  #head-right { margin-top: 8px !important; }
  #head-right .head-add {
    font-size: 16px !important;
    line-height: 1.8 !important;
  }
  #head-right img {
    width: 92% !important;
    max-width: 520px !important;
    height: auto !important;
    margin: 2px auto 0 !important;
    display: block !important;
  }

  .head-slide img,
  #eyecatche img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
  }

  /* メニュー */
  .head-menuarea { height: auto !important; }
  #main-nav {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background-color: #970d0d !important;
  }
  #main-nav li {
    display: block !important;
    width: 100% !important;
    min-width: 100% !important;
    float: none !important;
    background-image: none !important;
    border-bottom: 1px solid rgba(255,255,255,.35) !important;
  }
  #main-nav li a {
    display: block !important;
    width: 100% !important;
    padding: 0 12px !important;
    line-height: 46px !important;
    font-size: 17px !important;
    letter-spacing: .05em !important;
    white-space: normal !important;
  }
  #main-nav li .sub-menu {
    display: block !important;
    position: static !important;
    padding: 0 !important;
  }
  #main-nav li .sub-menu li a {
    background: #7e0a0a !important;
    font-size: 15px !important;
  }

  /* 本文・サイドバー */
  #main,
  #side-area {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    clear: both !important;
    margin: 0 !important;
    padding: 16px !important;
    line-height: 1.7 !important;
  }
  #side-area { padding-top: 8px !important; }

  .content,
  .main-text,
  .b-text,
  .archive-entry,
  .entry {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow-wrap: break-word !important;
  }

  img,
  iframe,
  embed,
  object,
  video {
    max-width: 100% !important;
  }
  img { height: auto !important; }
  iframe { width: 100% !important; }

  /* お知らせ */
  .news-area {
    width: 100% !important;
    height: auto !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    background-image: none !important;
  }
  .news-area::before {
    content: "沖縄健康サウナからのお知らせ";
    display: block;
    background: #a98561;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.4;
    padding: 10px;
    text-align: center;
  }
  .newsbox {
    width: 100% !important;
    height: auto !important;
    border: 1px solid #A27C52 !important;
  }
  .newsbox2 {
    width: 100% !important;
    height: auto !important;
    max-height: 360px !important;
    overflow-y: auto !important;
    margin-top: 0 !important;
    padding: 8px !important;
  }
  .table1 { font-size: 14px !important; }
  .td1-l { width: 104px !important; vertical-align: top !important; }
  .td1-r { vertical-align: top !important; }
  h3.newstitle {
    height: auto !important;
    line-height: 1.45 !important;
    font-size: 14px !important;
  }

  h2.title_t,
  h3.content_t,
  h3.blog-t,
  h4.blog-t,
  h4.content_t2,
  .single_date,
  #comment {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    background-image: none !important;
    padding: 10px 12px !important;
    margin: 0 0 14px !important;
    line-height: 1.45 !important;
  }
  h2.title_t,
  h3.blog-t,
  h4.blog-t {
    background: #a98561 !important;
    color: #fff !important;
    font-size: 18px !important;
    text-align: center !important;
  }

  table { width: 100% !important; max-width: 100% !important; }
  th, td { word-break: break-word !important; }

  .flex-area { display: block !important; }
  .shisetsu-box,
  .higawari-box,
  .menu-box,
  .relax-box dl,
  .relax-pic,
  .contact-area,
  .member-box {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .relax-pic { padding: 0 !important; }
  .keiro-td1,
  .keiro-td2 {
    display: block !important;
    width: 100% !important;
  }

  /* サイドバー */
  .side-menuarea,
  .side-linkarea,
  .linkarea1,
  .widget-area,
  li.widget-container {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .side-menuarea img,
  .widget-area img { max-width: 100% !important; height: auto !important; }

  /* フッター */
  #footer,
  .footarea,
  .copy {
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
  }
  .copy > div {
    width: 100% !important;
    height: auto !important;
    padding: 10px !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
  }
  .copy img { width: 42px !important; height: auto !important; vertical-align: middle !important; }
}


/* ===== SP2: スマホ固定CTA・誘導ボタン強化 ===== */
.sp-fixed-cta { display: none; }
@media screen and (max-width: 768px) {
  body { padding-bottom: 72px !important; }

  .sp-fixed-cta {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99999;
    display: flex;
    background: rgba(255,255,255,.98);
    box-shadow: 0 -2px 12px rgba(0,0,0,.18);
    border-top: 1px solid #e2d1bd;
  }
  .sp-fixed-cta a {
    flex: 1;
    display: block;
    text-align: center;
    text-decoration: none;
    color: #fff !important;
    font-weight: bold;
    font-size: 14px;
    line-height: 1.2;
    padding: 11px 4px 10px;
    background: #970d0d;
    border-right: 1px solid rgba(255,255,255,.35);
  }
  .sp-fixed-cta a:first-child { background: #008B3A; }
  .sp-fixed-cta a:last-child { border-right: none; background: #C2986D; }
  .sp-fixed-cta span {
    display: block;
    font-size: 11px;
    font-weight: normal;
    margin-top: 2px;
  }

  /* ヘッダーを少しコンパクト化 */
  #head1 { padding: 12px 10px 14px !important; }
  #logo-l img { max-width: 120px !important; }
  #logo img { max-width: 92% !important; }
  #top-head, #top-head2 { font-size: 14px !important; line-height: 1.45 !important; margin: 6px 0 10px !important; }
  .head-add { font-size: 15px !important; line-height: 1.6 !important; }
  #head-right img { max-width: 92% !important; }

  /* 画像リンク類の見栄え */
  #side-area h2, #side-area h3, .widget-title {
    font-size: 22px !important;
    line-height: 1.4 !important;
    margin: 0 0 12px !important;
  }

  /* Googleマップ iframe の高さ確保 */
  #side-area iframe, .content iframe {
    min-height: 260px !important;
  }
}
