@charset "utf-8";
/*
Theme Name: K’s Style Maui
Theme URI: https://ksmaui.fun/
Description: K’s Style Mauiのテーマ
Author: hm-solution
Author https://ksmaui.fun/
*/

/**********************************************************************************


  basic elements 


***********************************************************************************/

/* default
-------------------------------------------------------------------------------- */
body{background:url(img/bg.png) repeat #fff; text-align:center;}
#container{background:url(img/bg_img.png) no-repeat center top;}
a:link,a:visited{text-decoration:none; color:#222222;}
a:hover,a:active{text-decoration:underline; color:#F3700C;}
strong{font-weight:bold;}
hr{color:#000;}
li{list-style:none;}
.fred{color:#ff0000;}
.fwb{font-weight:bold;}
.fs20{font-size:20px;}
.fs18{font-size:18px;}
.fs16{font-size:16px;}
.fs14{font-size:14px;}
.w50p{width:50%;}
.w270{width:270px;}
.w350{width:350px;}
.bggray{background:#EEEEEE;}
.bgblue{background:#D6E6F6;}
.bgwblue{background:#EBF3FB;}
.ml05{margin-left:0.5em;} 
.rice{text-indent:0 0 0 1em; margin:0 0 0 -1em;}
.valign{vertical-align:middle;}
.bbl { border-bottom:1px dotted #221714;margin-bottom:5px;padding-bottom:5px;  }
.fL{float:left;}
.fR{float:right;}
ul.btn_tab li{display:inline-block;width:366px;text-align:center;}
li.btn_on a,li.btn_off a{display:block;height:58px;padding:26px 0 0 0;font-size:18px;}
li.btn_on a{background:url(img/vip_btn03.png) no-repeat;color:#333;}
li.btn_on a:hover{background:url(img/vip_btn03_on.png) no-repeat;color:#fff;text-decoration:none;}
li.btn_off a{background: url(img/vip_btn03_on.png) no-repeat;color:#fff;}
li.btn_off a:hover{background: url(img/vip_btn03.png) no-repeat;color:#333;text-decoration:none;}


/**********************************************************************************


  layout 


***********************************************************************************/

/* header 
---------------------------------------------------------- */
#header{width:1280px; height:176px; margin:0 auto; position:relative;}
#headerIn{width:980px; position:absolute; left:154px; top:45px;}
#header .fR{width:660px; text-align:left;}
#header h1{height:20px; padding:20px 0 0 10px; font-size:12px; white-space: nowrap;}


/* global navigation
---------------------------------------------------------- */
#gNavi{width:836px; height:110px;}
#gNavi li{float:left;display:block;}
#gNavi li a{display:block;}


/* footer 
---------------------------------------------------------- */
#footer{width:1280px; margin:0 auto; padding:20px 0 0 0; background:#fff;}
#footer #block01,#footer .cl{width:980px; margin:0 auto;}
#footer dl{width:980px; text-align:left; background:url(img/footer_bg.png) no-repeat right bottom; border-top:2px solid #000; border-bottom:1px solid #000; padding:20px 0; margin:18px auto 0 auto;}
#footer dt{font-weight:bold; font-size:14px;}
#footer dt span{font-weight:normal; font-size:12px;}
#footer dd{margin:6px 0 0 0;}
#footer .pageTop{position:absolute; left:50%; bottom:86px;margin:0 0 0 670px; position:fixed;}


/* contents 
---------------------------------------------------------- */
#content{width:980px; margin:0 auto; padding:0 150px; text-align:center; position:relative; background:#fff;}
#side{float:left; width:220px; position: absolute; top: -80px; left:150px}
#side .box{background:url(img/side_bg01.png) repeat-y; padding: 0 0 16px 0;}
#side dl{border-top:1px dotted #fff; margin:0 20px; color:#fff; text-align:left; line-height:1.4;}
#side dl a:link,#side dl a:visited{color:#fff;}
 *:first-child+html #side dl {margin:-6px 20px 0 20px;}
#side dt{display:block; margin:16px 0 0 0;}
#side dd{border-bottom:1px dotted #fff; padding:10px 0; font-size:12px; line-height: 1.7;}
#side .bnaArea{width:310px;}
#side .bnaArea ul{width:336px; margin-right:-26px !important; overflow: hidden; _zoom: 1;}
#side .bnaArea ul li{float:left; margin:0 26px 10px 0;}
#main{float:right; width:736px; margin: 20px 0 0 0; text-align:left;}



/**********************************************************************************


  TOP


***********************************************************************************/

/* layout 
---------------------------------------------------------- */
#top #header{height:640px;}
#top #header h1{color:#fff;}
#top #header .fluid_container {max-width:1280px; height:640px; margin:0 auto; background:#fff;}
#top #side{width:310px; top: -132px; left: 150px; line-height:0;}
#top #side dt{font-size:10px;}
#top #side dd{padding:0 0 12px 0; font-size:13px;}
#top #main{width:645px;}


/* contents
---------------------------------------------------------- */
#top #main .message{background:url(img/top_bg001.jpg?2001) no-repeat 0 79px; min-height:230px; color: #2A508C; }
#top #main .box{width:645px;}
#top #main .box ul{width:670px; margin-right:-25px !important; overflow: hidden; _zoom: 1;}
#top #main .box ul li {float:left; margin:0 25px 20px 0;}




/**********************************************************************************


  under


***********************************************************************************/

/* common
---------------------------------------------------------- */
h2 img{margin:0 auto;}
.pankuzu a:link,.pankuzu a:visited{color:#222;}
.pankuzu a:hover, .pankuzu a:active{text-decoration:underline; color:#F3700C;}
#main .box01 img.fR{margin:0 0 0 14px;}
#main .box01 img.fL{margin:0 14px 0 0;}
#main .box02{width:696px;}
.attention01{background:url(img/bg_attention.png) no-repeat; padding:20px; height:67px;}
.attention02 dt{background:url(img/bg_tit04.png) no-repeat; padding:16px 0 0 60px; height:36px;}
.ico01 li{background:url(img/ico_cir.png) no-repeat; padding:2px 0 0 18px; margin: 0 0 10px 0;}

/*title bg*/
.tit01{background:url(img/bg_tit01.png) no-repeat; width:717px; height:28px; color:#fff; font-size:18px; padding:12px 0 0 19px;}
.tit02{background:url(img/bg_tit02.png) no-repeat left bottom; width:736px; height:28px; color:#000; font-size:18px; font-weight:bold;}

/*table*/
.line01{border:1px solid #221714; width:736px;}
.line01 th{text-align:center; padding:14px auto; font-weight:bold; width:150px; vertical-align: middle;}
.line01 td{padding:12px;}
.line02{border-right:1px dotted #221714;}
.line01 span{font-size:11px;}
.line03{border-bottom:1px dotted #221714;}

.line04{border-top:1px solid #221714;border-right:1px solid #221714;text-align:center;width:100%;margin-bottom:5px;}
.line04 th{padding:5px; font-weight:bold;border-left:1px solid #221714;border-bottom:1px dotted #221714; }
.line04 td{padding:5px; border-bottom:1px solid #221714;border-left:1px solid #221714;background-color: #FFF; }

/*tab*/
#tab{width:736px;}
.btn_tab li{height:83px; float:left;}


/* about
---------------------------------------------------------- */
#about dd {margin: -1.4em 0 10px 60px;}
#map-canvas {margin: 0 20px;padding: 0;height: 400px;width: 695px;}
#map-canvas h1 {font-size: 16px;font-weight: bold;margin-bottom:9px;}
#map-canvas a {color:#1155CC;}


/* surf lessson
---------------------------------------------------------- */
#surf .box{position:relative;}
#surf .box dt{position: absolute; left: 400px; top: 100px; width: 280px; text-align:center;}
#surf .box dd{position: absolute; left: 410px; top: 150px; width: 280px;}
#surf #tab ul.btn_tab li {width: 245px !important;}

/* surf guide
---------------------------------------------------------- */
#guide .fluid_container {max-width:735px; height:415px; background:#000;}
#guide .fluid_container camera_wrap_1 div{width:736px;}
#guide .fluid_container cameraSlide img{width:736px !important;}
#guide .box01 div.fL{width:340px;}
#guide .box01 dl{background:#7F7F7F; text-align:center; padding:16px 10px;}
#guide .box01 dt{background:#fff; width:274px; margin:0 auto;}
#guide .box01 dd{color:#fff; text-align:left; line-height:1.8;}



/* snorkeling
---------------------------------------------------------- */
#snorkeling .box{position:relative; width:300px;}
#snorkeling .box dt{position: absolute; left: 0px; top: 60px; width: 280px; text-align:center;}
#snorkeling .box dd{position: absolute; left: 30px; top: 120px; width: 290px;}


/* snorkeling
---------------------------------------------------------- */
#contact .box{width:736px;}
#contact .box ul{width:754px; margin-right:-18px !important; overflow: hidden; _zoom: 1;}
#contact .box ul li {float:left; margin:0 18px 18px 0;}


/* topics
---------------------------------------------------------- */
#postBox {min-height:300px;}
#postBox dl{font-size:14px; border-top:1px dotted #ccc; padding:7px 0 0 0; margin:0 0 10px 0; width:660px;}
#postBox dt{width:100px;}
#postBox dd{width:650px; padding:0 0 0 15px; margin:-18px 0 0 100px;}


/* post
---------------------------------------------------------- */
#postArea p{font-size:14px; margin:0 0 30px 0;}
#postArea a:link, #postArea a:visited{color:#7BCEFD;}
#postArea a:hover, #postArea a:active{text-decoration:underline; color:#F3700C;}


/* sitemap
---------------------------------------------------------- */
#sitemap table{border-top:1px dotted #221714; border-collapse:collapse; width:736px; text-align:left;}
#sitemap th{width:200px; padding:10px 0;}
#sitemap td{padding:10px 0;}


/* faq
---------------------------------------------------------- */
#faq dt{background:url(img/faq_ico_q.png) no-repeat; padding:5px 0 0 35px; height:30px;}
#faq dd{background:url(img/faq_ico_a.png) no-repeat; padding:5px 0 0 35px; min-height:30px;}


/* contact
---------------------------------------------------------- */
#contact .box01 {background:#EFF8FC; padding:20px;}
#contact .box01 th{text-align:right; width:180px; padding:8px 16px 20px 0 !important; font-size:14px; font-weight:bold; vertical-align: top;}
#contact input, select, textarea {border: 1px solid #BFBFBF; padding: 7px 10px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
#contact .nameArea input{background:url(img/contact_ico01.png) no-repeat left center #fff; padding-left:30px;}
#contact .nameArea input:focus{background:url(img/contact_ico01.png) no-repeat left center #F7F7F7; outline:none; padding-left:30px;}
#contact .telArea input{background:url(img/contact_ico02.png) no-repeat left center #fff; padding-left:30px;}
#contact .telArea input:focus{background:url(img/contact_ico02.png) no-repeat left center #F7F7F7; outline:none; padding-left:30px;}
#contact .mailArea input{background:url(img/contact_ico03.png) no-repeat left center #fff; padding-left:30px;}
#contact .mailArea input:focus{background:url(img/contact_ico03.png) no-repeat left center #F7F7F7; outline:none; padding-left:30px;}
#contact textarea:focus{background:#F7F7F7; outline:none;}
#contact .wpcf7-submit{width: 120px; height: 44px; margin: 22px 0 10px 67px; background: #8EC8E2; border: none !important; color: #fff; font-size: 16px; font-weight: bold; cursor:pointer;}


/* 404 not found
---------------------------------------------------------- */
#notfound li{background:url(img/ico_cir02.png) no-repeat; padding:0 0 0 21px; margin: 0 0 5px 0;}


/* sokozikara
-------------------------------------------------------------------------------- */
#sokozikara h3{border:none !important;}
#sokozikara .item01 {position:relative;}
#sokozikara .item01 p{position:absolute; top:419px; left:43px; width:547px;}
#sokozikara .item02 {position:relative;}
#sokozikara .item02 .box img{position:absolute; top:0px; left:260px;}
#sokozikara .item02 dl{width:346px;}
#sokozikara .item02 .box{width:650px; height:330px; padding: 10px 28px 20px 28px; background:url(http://www.isana.com/ios_admin/wp-content/themes/isana/img/sokozikara/sokozikara_bg01.jpg) no-repeat;}
#sokozikara .item02 .box p{font-size:14px; font-weight:bold; margin-bottom:4px;}
#sokozikara .item02 .box ul{width:590px; padding:0 0 10px 0; border-bottom:1px solid #CCCCCC; list-style:none; margin:0 0 16px 0 !important;}
#sokozikara .item02 .box dl{margin:0 0 8px 0; width:650px;}
#sokozikara .item02 .box dt{background: url(img/sokozikara/ico_line01.gif) no-repeat left; width:110px; color:#FA8918; padding:0 0 0 20px;}
#sokozikara .item02 .box dd{width:375px; padding:0 0 0 15px; margin:-17px 0 0 115px;}
#sokozikara .item02 .box img{position:absolute; top:0px; left:362px;}
#sokozikara table{margin:0 0 6px 0;}
#sokozikara table th{text-align:center;}
#sokozikara .bg01{background:#BEEAF3;}
#sokozikara .bg02{background:#F2E7CD;}
#sokozikara .bg03{background:#ECDAB4;}
#sokozikara .bg04{background:#F6F6F6;}
#sokozikara .ctst{text-align:center; font-weight:bold;}
#sokozikara th{border-bottom:1px solid #fff;}
#sokozikara td{border-bottom:1px dotted #AAAAAA;}
#sokozikara .line01{border-bottom:1px solid #AAAAAA;}
#sokozikara .red{color:#ff0000;}
#sokozikara .item03{background:url(http://www.isana.com/ios_admin/wp-content/themes/isana/img/sokozikara/sokozikara_bg02_02.jpg) repeat-y; width:650px; margin:0 0 0 20px !important;}
#sokozikara .item03 dl{background:url(http://www.isana.com/ios_admin/wp-content/themes/isana/img/sokozikara/sokozikara_bg02.jpg) no-repeat; width:604px; padding:30px 0 10px 46px;}
#sokozikara .item03 dt{font-size:16px; font-weight:bold; color:#EC780C; border-left:4px solid #EC780C; padding:0 0 0 10px;}
#sokozikara .item03 dd{font-size:13px !important; background:#fff; padding:14px; margin:10px 0 20px 0 !important; width:500px;}
#sokozikara .item03 dd p{font-size:13px !important; margin:0 !important;}
#sokozikara .item03 dd .box{background:#eee; padding:10px; font-size:12px; margin:10px 0 0 0;}
#sokozikara table td {padding: 5px 8px; border: 1px #cccccc solid;}


/* hiking
-------------------------------------------------------------------------------- */
.hikingBox{background:url(img/hiking_img07.jpg?200128) no-repeat;height:500px;}
ul.atte {padding: 20px;background: #f9e9e9;border-radius: 4px;border: 2px dotted #E7D7D7;width: 340px;margin:0 auto;}
.bgBox {padding: 20px;background: #f9f9f9;border-radius: 4px;border: 1px dotted #e9e9e9;width:230px;}

/* ブラウザ幅が1280px以下 */
@media screen and (max-width: 1280px) {
#top #header {
height: 500px;
width: 1000px;
}

#top #headerIn {
width: 980px;
position: absolute;
left: 10px;
top: 45px;
}


#top h2 img {
margin: 0 auto;
width: 645px;
height: 79px;
}


#top #header .fluid_container {
max-width: 1000px;
height: 500px;
margin: 0 auto;
background: #fff;
}

#top #content {
width: 970px;
margin: 0 auto;
padding: 0 15px;
text-align: center;
position: relative;
background: #fff;
}

#top #side {
width: 310px;
top: -132px;
left: 15px;
line-height: 0;
}

#footer {
width: 1000px;
margin: 0 auto;
padding: 20px 0 0 0;
background: #fff;
}

#top .camera_wrap {
width: 100%;
height: 500px !important;
}


#header {
height: 176px;
width: 1000px;
}

#headerIn {
width: 980px;
position: absolute;
left: 10px;
top: 45px;
}

h2 img {
margin: 0 auto;
width: 1000px;
height: 221px;
}

#content {
width: 970px;
margin: 0 auto;
padding: 0 15px;
text-align: center;
position: relative;
background: #fff;
}

#side {
float: left;
width: 220px;
position: absolute;
top: -80px;
left: 15px;
}

#footer {
width: 1000px;
margin: 0 auto;
padding: 20px 0 0 0;
background: #fff;
}
}




/* デバイス幅が500px以下 */
@media only screen and (max-device-width: 500px) {
    body {
        width:1000px;
    }
}


