.lyt-special #str-contents{
font-size:16px;
line-height:1.75;
}
.lyt-special #str-contents dl,
.lyt-special #str-contents menu,
.lyt-special #str-contents ol,
.lyt-special #str-contents p,
.lyt-special #str-contents table,
.lyt-special #str-contents ul{
margin-top:20px;
}
.related-container{
padding:0 15px;
}
.related{
font-size:13px;
position:relative;
min-height:140px;
margin-top:10px;
padding-left:150px;
}
.related a{
text-decoration:none;
color:#333;
}
.related a:active .related-hdg,
.related a:focus .related-hdg,
.related a:hover .related-hdg{
text-decoration:underline;
}
.related .related-hdg{
font-size:18px;
font-weight:700;
line-height:1.25;
margin-bottom:-10px;
color:#0b41a1;
}
.related .related-thumb{
position:absolute;
top:0;
left:0;
}
.page-info{
font-size:13px;
margin-top:40px;
border-top:1px solid #ddd;
}
.page-info p,
.page-info ul{
margin-top:10px!important;
}
.sns li{
display:inline-block;
margin-left:10px;
vertical-align:top;
}
.sns li:first-child{
margin-left:0;
}
.hdg-l2-container{
line-height:1.25;
position:relative;
margin-top:100px;
padding:20px 0 16px;
border-width:2px 0;
border-style:solid;
border-color:#333;
}
.hdg-l2-container:after,
.hdg-l2-container:before{
position:absolute;
display:block;
width:100%;
height:1px;
content:'';
left:0;
overflow:hidden;
}
.hdg-l2-container:before{
top:2px;
}
.hdg-l2-container:after{
bottom:2px;
}
.hdg-l2-container:after,
.hdg-l2-container:before{
background-color:#999;
}
.hdg-l2-container .hdg-l2{
font-size:37px;
font-weight:400;
}
.hdg-l2-container .hdg-sup{
font-size:16px;
margin-top:10px!important;
}
.hdg-l3{
font-size:24px;
font-weight:700;
margin-top:50px;
padding-bottom:5px;
border-bottom:1px solid #c9c9c9;
}
.hdg-l3>span{
display:inline-block;
}
.hdg-l3>span:before{
display:inline;
content:'\3010';
}
.hdg-l3>span:after{
display:inline;
content:'\3011';
}
.hdg-l2-container+.hdg-l3{
margin-top:15px;
}
.hdg-l4{
font-size:18px;
margin-bottom:-10px;
}
.hdg-l4>span{
font-size:11px;
font-weight:400;
}
p.link-txt{
font-size:18px;
margin:15px 0 -25px 0;
}
p.link-txt strong{
color:#333;
}
.photo{
max-width:800px;
margin-right:auto;
margin-left:auto;
}
.photo .caption{
font-size:12px;
display:block;
margin-top:4px;
}
.note{
font-size:14px;
position:relative;
padding-left:1.5em;
}
.note:before{
position:absolute;
top:0;
left:0;
content:'\203b';
}
.list-bullet-01>li,
.list-bullet>li{
position:relative;
overflow:hidden;
margin-top:5px;
padding-left:10px;
}
.list-bullet-01>li:before,
.list-bullet>li:before{
position:absolute;
top:7px;
left:0;
display:block;
overflow:hidden;
width:4px;
height:4px;
content:'';
background-color:#333;
}
.list-bullet-01>li>b,
.list-bullet>li>b{
display:block;
}
.list-bullet-01>li>div,
.list-bullet>li>div{
overflow:hidden;
}
.list-bullet-01>li{
padding-left:8px;
}
.list-bullet-01>li:before{
top:9px;
width:2px;
height:2px;
border-radius:1px;
}
.list-icon{
font-size:13px;
max-width:800px;
margin:5px auto 0!important;
}
.list-icon>li{
display:inline-block;
margin:5px 5px 0 0;
padding:3px 15px 2px;
border-radius:3px;
}
.list-info>li .info-icon,
.list-info>li .info-icon:before{
top:0;
left:0;
display:block;
width:20px;
height:20px;
overflow:hidden;
}
.list-icon>li:last-child{
margin-right:0;
}
.list-icon>li.gourmet{
background-color:#ffefc3;
}
.list-icon>li.spa{
background-color:#ffdedb;
}
.list-icon>li.sightseeing{
background-color:#d0f4ef;
}
.list-icon>li.view{
background-color:#d4e7f7;
}
.list-icon>li.nature{
background-color:#d2f4d0;
}
.list-icon>li.diving{
background-color:#ceefff;
}
.list-info{
line-height:1.45;
}
.list-info>li{
position:relative;
margin-top:6px;
padding-left:26px;
}
.list-info>li .info-icon{
line-height:20px;
position:relative;
position:absolute;
padding:2px;
}
.list-info>li .info-icon:before{
position:absolute;
content:'';
font-size:12px;
text-align:center;
color:#fff;
border-radius:3px;
background-color:#999;
}
.list-info>li .info-icon.address:before{
content:'\4f4f';
}
.list-info>li .info-icon.phone:before{
content:'Tel';
}
.list-info>li .info-icon.time:before{
content:'\6642';
}
.list-info>li .info-icon.holiday:before{
content:'\4f11';
}
.list-info>li .info-icon.site:before{
content:'HP';
}
.list-info>li.access{
margin:10px 0 0 -26px;
}
.list-info>li.access>span{
display:table;
}
.list-info>li.access>span:after,
.list-info>li.access>span:before{
display:inline-block;
content:'\3010';
}
.list-info>li.access>span:after{
content:'\3011';
}
.tab{
font-size:17px;
font-weight:700;
line-height:1.25;
display:table;
width:100%;
margin:20px 0;
table-layout:fixed;
border-bottom:2px solid #d2d2d2;
}
.tab>li{
position:relative;
display:table-cell;
height:65px;
padding-left:10px;
text-align:center;
vertical-align:bottom;
}
.btn,
.btn-01,
.btn-02{
font-size:16px;
font-weight:700;
line-height:1.3;
text-align:left;
text-decoration:none;
}
.tab>li:first-child{
padding-left:0;
}
.tab>li a{
display:table;
box-sizing:border-box;
width:100%;
height:100%;
padding:5px;
text-decoration:none;
color:#333;
background-color:#efefef;
}
.tab>li span{
display:table-cell;
vertical-align:middle;
}
.tab>li span > span{
display: inline-block;
}
.tab>li.is-active a{
color:#fff;
background-color:#555;
}
.tab.branch{
margin-top:60px!important;
border-top:2px solid #d2d2d2;
border-bottom:none;
}
.tab.branch>li{
vertical-align:top;
}
.btn,
.btn-01{
display:inline-block;
margin-bottom:4px;
padding:13px 15px 11px;
color:#fff;
border:none;
border-radius:5px;
background-color:#078acb;
box-shadow:0 4px 0 #066fa3;
}[class*=cmn-list-col-] .btn,[class*=cmn-list-col-] .btn-01{
display:block;
}
.btn-01:active,
.btn-01:focus,
.btn-01:hover,
.btn:active,
.btn:focus,
.btn:hover{
color:#fff;
background-color:#0673c1;
box-shadow:0 4px 0 #005592;
}
.btn-01:visited,
.btn:visited{
color:#fff;
}
.btn-02,
.btn-02:visited{
color:#06c;
}
.btn-01{
background-color:#69a30c;
box-shadow:0 4px 0 #588d00;
}
.btn-01:active,
.btn-01:focus,
.btn-01:hover{
background-color:#578e00;
box-shadow:0 4px 0 #4c7d00;
}
.btn-02{
display:inline-block;
padding:10px 15px;
border:1px solid #ccc;
border-radius:5px;
background-color:#fff;
box-shadow:0 -3px 0 #e5e5e5 inset;
}
.btn-02:active,
.btn-02:focus,
.btn-02:hover{
color:#06c;
background-color:#f7f7f7;
}[class*=cmn-list-col-] .btn-02{
display:block;
}
.btn-nav-top{
line-height:2;
position:fixed;
right:5px;
bottom:10px;
display:block;
overflow:hidden;
width:40px;
height:0;
padding-top:40px;
transition:all .5s;
opacity:0;
border:none;
border-radius:50%;
background:#007ac8;
}
.btn-nav-top:after,
.btn-nav-top:before{
position:absolute;
top:12px;
left:50%;
content:'';
}
.btn-nav-top:before{
width:12px;
height:12px;
margin-left:-7px;
-ms-transform:rotate(-135deg);
transform:rotate(-135deg);
border-right:2px solid #fff;
border-bottom:2px solid #fff;
}
.btn-nav-top:after{
display:block;
width:0;
height:19px;
margin-left:-1px;
border-right:1px solid transparent;
border-left:1px solid transparent;
background-color:#fff;
}
.btn-nav-top.fade-in{
z-index:10;
opacity:1;
display: none;
}
.box{
font-size:14px;
margin-top:20px;
padding:20px;
background-color:#f5f5f5;
}
.box>:first-child{
margin-top:0;
}
.box-01{
margin-top:50px;
border-top:1px solid #ddd;
}
.carousel .cmn-carousel-item{
padding:0;
}
.carousel .cmn-carousel-item-inner ul li{
text-align:center;
}
.carousel .cmn-carousel-item-inner ul li .caption{
font-size:12px;
display:block;
max-width:800px;
margin:4px auto 0;
text-align:left;
}
.carousel .carousel-thumb{
text-align:center;
}
.carousel .carousel-thumb>li{
display:inline-block;
overflow:hidden;
width:110px;
height:auto;
margin:0 5px;
}
.carousel .carousel-thumb>li.active a{
position:relative;
display:block;
}
.carousel .carousel-thumb>li.active a:before{
position:absolute;
top:0;
left:0;
display:block;
overflow:hidden;
width:100%;
height:100%;
content:'';
box-sizing:border-box;
border:2px solid #ffb864;
background-color:rgba(255,255,255,.5);
}
.txt-right{
text-align:right;
}
.txt-right > a{
text-decoration:none;
}
.diving-info-txt{
font-size:12px;
}
@media screen and (max-width:720px){
.lyt-special #str-contents{
font-size:13px;
line-height:1.65;
}
.lyt-special #str-contents dl,
.lyt-special #str-contents menu,
.lyt-special #str-contents ol,
.lyt-special #str-contents p,
.lyt-special #str-contents table,
.lyt-special #str-contents ul{
margin-top:10px;
}
.related-container{
padding:0;
}
.related{
min-height:110px;
padding-left:110px;
}
.related .related-hdg{
font-size:15px;
}
.related .related-thumb{
max-width:100px;
}
.hdg-l1{
margin:0 -10px;
}
.hdg-l2-container .hdg-l2{
font-size:26px;
}
.hdg-l3{
font-size:18px;
margin-top:40px;
}
.hdg-l4{
font-size:15px;
margin-bottom:-5px;
}
.list-info{
font-size:13px;
}
.box{
margin-top:10px;
padding:10px;
}
.box-01{
margin-top:30px;
}
p.link-txt{
font-size:16px;
margin:15px 0 -18px 0;
}
}
@media screen and (max-width:550px){
.btn,
.btn-01,
.btn-02{
line-height:1.2;
display:block;
}
.related-container{
margin-top:-10px;
}
.related{
margin-top:20px;
}
.sns li{
margin-left:5px;
}
.hdg-l2-container{
margin-top:40px;
padding:16px 0 12px;
}
.hdg-l2-container .hdg-l2{
font-size:18px;
}
.hdg-l2-container .hdg-sup{
font-size:12px;
}
.hdg-l3{
font-size:16px;
}
.tab{
font-size:13px;
}
.tab>li{
padding-left:3px;
}
.tab>li a{
padding:3px;
}
.btn,
.btn-01{
font-size:15px;
padding:10px 15px 7px;
}
.btn-02{
font-size:14px;
}
.carousel .carousel-thumb>li{
width:60px;
height:auto;
}
p.link-txt{
font-size:14px;
margin:18px 0 -18px 0;
}
.tab>li span{
font-size:13px;
}
.tab>li span > span{
display:block;
}
.tab {
font-size: 15px;
border-bottom:0;
}
.tab.branch {
border-top:0;
}
.btn-nav-top.fade-in{
display: block;
}
}