@charset "utf-8";
/*
Theme Name: とりっぷ小豆島
Theme URI:
Description: 
Author: greenfieldgrafik
Version: 1.0
*/

/*以降、カスタマイズ領域*/

/*//////////////////////////////
 * CSS インポート
 /////////////////////////////*/
@import url('reset.css');
@import url('parts.css');
@import url('common.css');

/*//////////////////////////////
 * トップページ
 /////////////////////////////*/
/* メインイメージ */
#main_visual {width:100%;position:relative;}
#main_visual h2{width:56.95%;position:absolute;top:50%;left:50%;margin-top: -9%;margin-left:-28.47%;text-align:center;z-index:3;}
#main_visual .bx-wrapper {
position: relative;
margin: 0 auto;
padding: 0;
}
#main_visual .bx-wrapper .bx-viewport {
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
border: 0px;
left: 0px;
background: none;
}
#main_visual .bxslider li{z-index:1!important;}
#main_visual .bxslider li img{width:100%;}

/* 見出し */
#index .title_area1{width:100%;}
#index .title_area1 h3{float:left;margin-bottom:10px;}
#index .title_area1 p{float:right;margin-bottom:10px;}
#index .title_area1 p a{text-decoration:none;}
#index .title_area1 p a:hover{text-decoration:underline;}

/*//////////////////////////////
 * スポット一覧
 /////////////////////////////*/


/*//////////////////////////////
 * スポット詳細
 /////////////////////////////*/
/* sec1 */
#spot_detail #sec1{
    float:left;
    width:45%;
    padding:15px 2%;
    background:#fff;
    position:relative;
}
#spot_detail #sec1 .to_back{
    position:absolute;
    top:15px;left:20px;
}
#spot_detail #sec1 .date_detail{
    position:absolute;
    top:15px;right:20px;
}
#spot_detail h2{padding-top:25px;font-size:22px;text-align:center;line-height:1.8em;margin-bottom:5px;}
#spot_detail h3{text-align:center;margin-bottom:10px;}
#spot_detail h4{padding-top:10px;}
#spot_detail .img{margin-bottom:15px; text-align:center;}
#spot_detail .map{margin-bottom:15px;}
#spot_detail .map iframe{width:100%!important;height:353px;}
#spot_detail .info{padding:10px 0;}

/* sec2 */
#spot_detail #sec2{
    float:right;
    width:50%;
}
#spot_detail #container .item{padding:5px;margin:5px;background:#fff;width:150px;}
#spot_detail #container .item .head_area h4{padding-top:10px;margin-bottom:5px;}
#spot_detail #container .item .img{width:100%;margin-bottom:5px;}
#spot_detail #container .item .address{margin-bottom:20px;}
#spot_detail #container .item .foot_area h5{padding-top:5px;}
#contents .inner .linkbox {
    background-color: #FFF;
    padding: 1%;
    width: 31%;
    margin-bottom: 10px;
}
.linkbox-center {
    background-color: #FFF;
    padding: 1%;
    width: 98%;
    margin-bottom: 10px;
}
.f-left {float: left;}
.f-right {float: right;}
@media screen and (max-width: 760px) {
    #spot_detail #sec1{width:94%;float:none;margin:0 auto 20px;}
    #spot_detail #sec2{width:100%;}
#contents .inner .linkbox ,
#contents .inner .linkbox-center {
    background-color: #FFF;
    /*padding: 1%;
    width: 98%;*/
}
#contents .inner .linkbox-center {
    margin-left:0;
}
.f-left {float: none;}
.f-right {float: none;}

}
@media screen and (max-width: 760px) {
    #spot_detail .map iframe{height:200px;}
#contents .inner .linkbox {
    background-color: #FFF;
    padding: 1.5%;
    width: 97%;
}
#contents .inner .linkbox-center {
    background-color: #FFF;
    padding: 1.5%;
    width: 97%;
    margin-left:0;
}
.f-left {float: none;}
.f-right {float: none;}

}
@media screen and (max-width: 480px) {
    #spot_detail #container{width:100%!important;}
    #spot_detail #container .item{width:95%;}
    #spot_detail #container .item .img img{width:100%;height:auto;}
#contents .inner .linkbox ,
#contents .inner .linkbox-center {
    background-color: #FFF;
    padding: 3%;
    width: 94%;
    font-size:85%
}
#contents .inner .linkbox-center {
    margin-left:0;
}

.f-left {float: none;}
.f-right {float: none;}

}
#contents .inner .about {
    clear: both;
    margin-bottom: 30px;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
    font-weight: bold;
    text-align: center;
    background-color: #FFF;
    padding: 10px;
}
#contents .inner .about .aboutthis {
    width: 100%;
    background-color: #A6BF84;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 15px;
    margin-left: auto;
    height: 30px;
    color: #FFF;
    line-height: 30px;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-weight: bold;
}

#contents .inner .linkbox  a,
.linkbox-center a {text-decoration:none}

.linkbox a .rortaly {
    text-align: center;
    display: block;
    width: 100%;
    height: 50px;
    line-height: 20px;
    background-color: #FDD22B;
    text-decoration: none;
    color: #7F4F21;
    letter-spacing: 0.2em;
    padding-top: 10px;
}
.linkbox a .geopark {
    text-align: center;
    display: block;
    width: 100%;
    height: 50px;
    line-height: 20px;
    background-color: #70C4B2;
    color: #FFF;
    text-decoration: none;
    letter-spacing: 0.2em;
    padding-top: 10px;
}
.linkbox-center a .tabinavi {
    text-align: center;
    display: block;
    width: 100%;
    height: 50px;
    line-height: 20px;
    background-color: #F4B3C2;
    color: #FFF;
    text-decoration: none;
    letter-spacing: 0.2em;
    padding-top: 10px;
}
.link_wrap {
    margin-bottom: 30px;
}