@charset "utf-8";

/* init **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
*{ margin:0; padding:0; box-sizing:border-box; }
select option{ padding:0 5px; }
body{ color:#2e2723;/* background: url(../images/bg.png);*/ font:14px "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif; line-height:2; min-width:1200px; word-wrap:break-word; overflow-wrap:break-word; -webkit-text-size-adjust:100%; }
h1 , h2 , h3 , h4 , h5 , h6 , address{ font-style:normal; font-weight:normal; font-size:100%; }
ul{ list-style-type:none; }
img{ border:0; vertical-align:bottom; }

table{ border-spacing:0; border:0; }
table th{ text-align:left; vertical-align:middle; font-weight:normal; }
table td{ word-break:break-all; }

.floatR{ float:right; }
.floatL{ float:left; }

.alignL{ text-align:left; }
.alignR{ text-align:right; }
.alignC{ text-align:center; }

.rel{ position:relative; }
.abs{ position:absolute; }


/* clearfix **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.cf:after{ content:" "; display:block; clear:both; }


/* link **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
a:link , a:visited{ color:#4aacdf; text-decoration:underline; }
a:hover{ color:#4aacdf; }
a:hover , a img:hover , input[type=image]:hover{ opacity:0.8; }


/* font decoration **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
/* size */
.fontS{ font-size:10px; }
.fontSM{ font-size:12px; }
.fontM{ font-size:14px; }
.fontML{ font-size:16px; }
.fontL{ font-size:20px; }
.font26{ font-size:26px; }
.font30{ font-size:30px; }
.font32{ font-size:32px; }

/* color */
.txt-blue{ color:#4aacdf; }
.txt-navy{ color:#003d97; }
.txt-brown{ color:#2e2723; }
.txt-green{ color:#7dc257; }
.txt-white{ color:#fff; }
.txt-black{ color:#2e2723; }
.txt-orange{ color:#e1550e; }
.txt-yellow{ color:#d4b924; }
.txt-red , .required , .error{ color:#e33f3f; }

/*indent */
.idt{ padding-left:1.0em; text-indent:-1.0em; }
.idt-half{ padding-left:0.5em; text-indent:-0.5em; }
.idt-dott{ padding-left:1.3em; text-indent:-1.3em; }
.idt-sp{ text-indent:1.0em; }

/*other */
.str{ font-weight:bold; }
.str-reset{ font-weight:normal; }
.underline{ text-decoration:underline; }
.negaline{ text-decoration:line-through; }

/*lh-reset*/
.lh-reset{ line-height:1.4; }


/* responsive  **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.pc-item{ display:block; }
.sp-item{ display:none; }


/* space **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
/* padding */
.spt0{ padding-top:0px !important; }
.spt5{ padding-top:5px !important; }
.spt10{ padding-top:10px !important; }
.spt15{ padding-top:15px !important; }
.spt20{ padding-top:20px !important; }
.spt25{ padding-top:25px !important; }
.spt30{ padding-top:30px !important; }
.spt35{ padding-top:35px !important; }
.spt50{ padding-top:50px !important; }

.spb0{ padding-bottom:0px !important; }
.spb5{ padding-bottom:5px !important; }
.spb10{ padding-bottom:10px !important; }
.spb15{ padding-bottom:15px !important; }
.spb20{ padding-bottom:20px !important; }
.spb25{ padding-bottom:25px !important; }
.spb30{ padding-bottom:30px !important; }
.spb35{ padding-bottom:35px !important; }

/* margin */
.smt0{ margin-top:0px !important; }
.smt5{ margin-top:5px !important; }
.smt10{ margin-top:10px !important; }
.smt15{ margin-top:15px !important; }
.smt20{ margin-top:20px !important; }
.smt25{ margin-top:25px !important; }
.smt30{ margin-top:30px !important; }
.smt35{ margin-top:35px !important; }
.smt40{ margin-top:40px !important; }
.smt45{ margin-top:45px !important; }
.smt50{ margin-top:50px !important; }

.smb0{ margin-bottom:0px !important; }
.smb5{ margin-bottom:5px !important; }
.smb10{ margin-bottom:10px !important; }
.smb15{ margin-bottom:15px !important; }
.smb20{ margin-bottom:20px !important; }
.smb25{ margin-bottom:25px !important; }
.smb30{ margin-bottom:30px !important; }
.smb35{ margin-bottom:35px !important; }
.smb40{ margin-bottom:40px !important; }
.smb45{ margin-bottom:45px !important; }
.smb50{ margin-bottom:50px !important; }

.sml0{ margin-left:0px !important; }
.sml10{ margin-left:10px !important; }
.sml20{ margin-left:20px !important; }
.sml30{ margin-left:30px !important; }
.sml50{ margin-left:50px !important; }

.smr0{ margin-right:0px !important; }
.smr20{ margin-right:20px !important; }
.smr30{ margin-right:30px !important; }
.smr50{ margin-right:50px !important; }

/* paragraph */
p{ margin:0 0 20px; }


/* input **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
input.ctl , textarea.ctl , select.ctl{ padding:10px; border:solid 1px #e5e5e5; border-radius:5px; }
input.sizeS{ width:60px; }
input.sizeM{ width:500px; }
input.sizeL{ width:800px; }
textarea.sizeS{ width:500px; height:80px; }
textarea.sizeM{ width:500px; height:120px; }
textarea.sizeL{ width:800px; height:120px; }


/* wrap **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.wrap{ width:1200px; position:relative; margin:0 auto; }

article div.wrap{ margin-bottom:60px; }


/* main **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.main{ position:relative; }
.marina_weather{ padding:0px 18px 20px; margin-top: 20px; background: url(../images/bg_marina.png); width:480px; height:325px; }
.marina_weather .on a{ color:#fff; text-decoration: none; }
.marina_weather .txt{ margin:15px 0 15px 0px; }
.marina_weather ul li{ background: url(../images/bg_weather_off.png); float:left; width:46px; height:40px; margin:1px; text-align:center; font-size:12px; color:#999999; }
.marina_weather ul li.on{ background: url(../images/bg_weather_on.png); color:#fff; }
.marina_weather ul li img{ margin-top:-20px; width: 36px; }


/* gnav **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
/*.gnav ul li{ float:left; width:calc(100% / 4); height:80px; background: url(../images/arrow_d.png) center right 20px / 28px 16px no-repeat; text-align:left; padding-left:25px; }
.gnav ul li:nth-child(4){background: url(../images/arrow_d_mymarine.png) center right 20px / 28px 16px no-repeat; }
.gnav ul li a{ display:block; width:100%; height:80px; display:flex; align-items:center; padding-left:25px; }
.gnav ul li a img{ width:calc(100% - 50px); max-width:280px; }
.gnav ul li a:hover,.gnav ul li a img:hover{ opacity:1; }
.gnav ul li.gtop:nth-child(1){ background-color:#54b4e6; }
.gnav ul li.gtop:nth-child(2){ background-color:#4aacdf; }
.gnav ul li.gtop:nth-child(3){ background-color:#339fd7; }
.gnav ul li.gtop:nth-child(4){ background-color:#ffcc00; }
.gnav ul li.gtop:nth-child(1):hover{ background-color:#6dbfeb; }
.gnav ul li.gtop:nth-child(2):hover{ background-color:#67b8e5; }
.gnav ul li.gtop:nth-child(3):hover{ background-color:#5db2df; }
.gnav ul li.gtop:nth-child(4):hover{ background-color:#fdd73f; }
.gnav ul li.gtop ul li{ background: url(../images/gnav_bg.png); height:92px;}
.gnav ul li.gtop:nth-child(4) ul li{ background: url(../images/gnav_bg_my.png);}*/


/* slider **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.bnr-slider{ /*background:url(../images/base.png);*/ padding:30px 0; }
.bnr-slider .slider{/* width:1200px;*/ margin:0 auto; }
.bnr-slider .slider img { width: 100%; height: auto; }

.bnr-slider .slider .slick-slide{ margin:0 5px; }
.bnr-slider .slider .slide-arrow{ position:absolute; width:20px; height:auto; z-index:1; cursor:pointer; }
.bnr-slider .slider .prev-arrow{ top:calc(50% - 26px); left:-30px; }
.bnr-slider .slider .next-arrow{ top:calc(50% - 26px); right:-30px; }


/* slider_banner_top **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.slider_banner_top ul{ width:1000px; margin:0 auto; padding-top:80px; }
.slider_banner_top ul li img { width: 100%; height: auto; }

.slider_banner_top ul .slick-slide{ margin:0 5px; }
.slider_banner_top ul .slide-arrow{ position:absolute; width:20px; height:auto; z-index:1; cursor:pointer; }
.slider_banner_top ul .prev-arrow{ top:calc(50% + 15px); left:-30px; }
.slider_banner_top ul .next-arrow{ top:calc(50% + 15px); right:-30px; }


/* header **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.header .site{ color:#fff; font-size:12px; line-height:2; background:#000b1c; padding:8px 30px; }
.header .site h1{ float:left; }
.header .site ul{ float:right; }
.header .site li{ float:left; }
.header .site li:not(:first-child){ margin-left:10px; }

.header .top{ background:url(../images/base.png); height:66px; padding:0 30px; }
.header .logo a{ display:block; width:calc(100% - 820px); height:50px; background:url(../images/logo_sub.png) no-repeat; float:left; margin-top:10px; text-indent:-9999px; }
.header .top .link{ float:right; padding-top:20px; }
.header .top .link a{ margin-left:15px; }
.header .top .link a .boat{ background:url(../images/header_link_boat_icon.png) no-repeat left center; padding-left:65px; height:38px; }
.header .top .link a .scuba{ background:url(../images/header_link_scuba_icon.png) no-repeat left center; padding-left:48px; height:38px; }
.header .top .link a .crew{ background:url(../images/header_link_crew_icon.png) no-repeat left center; padding-left:48px; height:38px; }
.header .top .link a .spot{ background:url(../images/header_link_spot_icon.png) no-repeat left center; padding-left:45px; height:36px; }

.header .rig{ float:right; padding-top:20px; }
.header .rig .ctl{ float:left; border-bottom:1px solid #4a94df; }
.header .rig .ctl .search{ float:left; width:200px; height:36px; text-align:left; background:url(../images/search.png) 13px 6px / 18px 18px no-repeat; }
.header .rig .ctl .search-btn{ float:left; }
.header .rig .ctl .search .search-txt{ width:154px; height:32px; background-color: rgba(255,0,0,0); border-color:rgba(255,0,0,0); color:#fff; margin-left:38px; }

.header .rig.mypage{ width:406px; }

/* sp gnav btn */
.header .sp-gnav-btn{ position:absolute; top:15px; right:15px; width:28px; height:22px; cursor:pointer; display:none !important; }
.header .sp-gnav-btn span{ position:absolute; left:0; width:100%; height:2px; background-color:#4a94df; border-radius:6px; }
.header .sp-gnav-btn , .header .sp-gnav-btn span{ display:inline-block; transition:all 0.2s; }
.header .sp-gnav-btn span:nth-of-type(1){ top:0; }
.header .sp-gnav-btn span:nth-of-type(2){ top:10px; }
.header .sp-gnav-btn span:nth-of-type(3){ bottom:0; }

.header .sp-gnav-btn.active span:nth-of-type(1){ -webkit-transform:translateY(10px) rotate(-45deg); transform:translateY(10px) rotate(-45deg); }
.header .sp-gnav-btn.active span:nth-of-type(2){ opacity:0; }
.header .sp-gnav-btn.active span:nth-of-type(3){ -webkit-transform:translateY(-10px) rotate(45deg); transform:translateY(-10px) rotate(45deg); }

/* sp gnav */
/*.sp-gnav{ position:fixed; top:90px; left:0; width:100%; height:calc(100% - 90px); -webkit-height:calc(100% - 90px); background-color:#f0fbff; overflow:auto; z-index:9999; }*/

.sp-gnav .mdropmenu li a{ position:relative; display:block; width:100%; color:#333; font-size:16px; text-align:left; border-top:solid 1px  rgba(255,255,255,0.2); padding:20px 20px 5px 34px; }
.sp-gnav .mdropmenu li a img.s_list{ position: absolute; top: 30px; right: 30px; transition: 0.3s;}
.sp-gnav .mdropmenu li a.active img.s_list{ transform: rotate(90deg); }
.sp-gnav .mdropmenu li.btn{ margin: 40px auto 0; width: 398px; }
.sp-gnav .mdropmenu li.btn a{ display: block; width: 190px;  border: solid 1px #ffffff; padding: 5px 25px; color:#ffffff; text-decoration:inherit; text-align:center; background: none; float: left; margin-left: 18px; }
.sp-gnav .mdropmenu li.btn a:first-child{ margin-left: 0px; }
.sp-gnav .child { display: none; padding: 18px 0 0; }
.sp-gnav .child li{ padding: 0; }
.sp-gnav .child li a{ border: initial; color: #fff; text-decoration: none; background:none; padding: 0px 20px 0px 45px; line-height: 2; font-size: 13px; }
.sp-gnav .child li span{ letter-spacing:-2px; }
.sp-gnav .rig ul{ margin:5px 5px; width:100%; }
.sp-gnav .rig li{ width:calc(100% / 2 - 10px); width:-webkit-calc(100% / 2 - 10px); float:left; margin:5px; }
.sp-gnav .rig li a{ display:block; width:100%; background:#4a94df; text-align:center; }

.sp-gnav .link li{ background:#003c96; padding:10px 20px; margin:5px; }


/* リニューアル gnav */
.overlay { content: "";  display: block;  width: 0;  height: 0;  background-color: rgba(0, 0, 0, 0.5);  position: absolute;  top: 0;  left: 0;  z-index: 2;  opacity: 0;  transition: opacity .5s; }
.overlay.open { position:fixed; width: 100%;  height: 100%;  opacity: 1; }
body { height: 100%;  min-height: 100vh;  /*padding: 0 50px;*/  /*background-color: #eee;*/  transition: all .5s;  /*display: flex;*/  flex-direction: column;  justify-content: center; }
.menu-trigger { display: inline-block;  width: 48px;  height: 28px;  vertical-align: middle;  cursor: pointer;  position: fixed;  top: 18px;  right: 10px;  z-index: 100;/*   transform: translateX(0);  transition: transform .5s; */}
/* .menu-trigger.active { transform: translateX(-250px); }
 */
.menu-trigger span { display: inline-block;  box-sizing: border-box;  position: absolute;  left: 0;  width: 100%;  height: 4px;  background-color: #ffffff;  transition: all .5s; }
.menu-trigger.active span { background-color: #fff; }
.menu-trigger span:nth-of-type(1) { top: -5px; }
.menu-trigger.active span:nth-of-type(1) { transform: translateY(9px) rotate(-45deg); }
.menu-trigger span:nth-of-type(2) { top: 5px; }
.menu-trigger.active span:nth-of-type(2) { opacity: 0; }
.menu-trigger span:nth-of-type(3){ bottom: 9px; }
.menu-trigger span:nth-of-type(4){ color: #FFF; font-size: 15px; background: none; bottom:7px; text-align: center; }
.menu-trigger span:nth-of-type(5){ display:none; }
.menu-trigger.active span:nth-of-type(4) { display:none; }
.menu-trigger.active span:nth-of-type(5) { display:block; color: #FFF; font-size: 14px; background: none; bottom:5px; }
.menu-trigger.active span:nth-of-type(3) { transform: translateY(-10px) rotate(45deg); }
.menu_nav { background: rgb(0, 11, 28, 0.8); width: 610px; height:100%; padding-top: 60px; position: fixed;  top: 0;  right: 0;  z-index: 10;  transform: translateX(100%);  transition: all .3s; }
.menu_nav.open { transform: translateX(0); overflow-y: auto; }
.menu_nav li { color: #fff;  text-align: center;  padding: 10px 0; margin: 0 50px; }
.menu_nav .sns img{margin:20px 10px;}


/* pickup **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.pickup{ background: #f2f6fa; margin-top:30px; margin: 150px 0 0; }
.pickup h3 img{ margin-top: -90px; margin-bottom: 40px; }
.pickup .bdr { border-left: 1px solid #d0d8df; }
.pickup ul{ display:flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; }
.pickup li{ width:33.3%; position:relative; padding-bottom:45px; }
.pickup li:nth-child(3) .bdr, .pickup li:nth-child(6) .bdr{ border-right: 1px solid #d0d8df; }
.pickup li > a{ display:block; width:100%; height:320px; border-left: solid 0.5px #fff; }
.pickup li .tit{ font-size:16px; margin:15px 20px 5px; padding-left:15px; background:url("../images/list_sq.png") no-repeat left 2px; line-height:1.6;  }
.pickup li .tit a{ color:#333; text-decoration:none; }
.pickup li .txt{ font-size:14px; margin:0 20px 10px; }
.pickup li .txt_h{ height: 10em; }
.pickup li.channel a{position: relative;}
.pickup li.channel a img{position:absolute; bottom:15px; left:15px;}

.pickup li .btn{ margin:0 20px; width:calc(100% - 40px); width:-webkit-calc(100% - 40px); bottom:10px; }
.pickup li .btn.num a{ width:38%; float:right; }
.pickup li .btn.num a:not(:first-child){ margin-left:8px; }

.pickup li .btn a{ display:block; width:100%; height:35px; /*border:solid 2px #4a94df;*/ text-indent:-9999px; background:url("../images/pickup_reading_btn_off.png") right no-repeat; padding:0 25px; }
.pickup li .btn a.first{ background-image:url("../images/pickup_first_btn_off.png"); width: 38%; }
.pickup li .btn a.shop{ background-image:url("../images/pickup_shop_btn_off.png"); width: 24%; }
.pickup li .btn a.tour{ background-image:url("../images/pickup_tour_btn_off.png"); }
.pickup li .btn a.channel{ background-image:url("../images/pickup_channel_btn_off.png"); }


/* sponsor **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.sponsor{ width:1200px; /*margin-top:0px;*/ margin:0 auto; }
.sponsor li a{ display:block; width:100%; height:200px; }
.sponsor li{ width:33.3%; font-size:16px; margin:0 auto; /*padding-bottom:46px;*/ float:left; }


/* footer nav **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.footer-nav{ background:#eff9ff url("../images/footer_wave.png") repeat-x; padding:50px 0 40px; margin-top:30px; }
.footer-nav ul{ width:285px; float:left; }
.footer-nav ul:not(:last-child){ margin-right:20px; }
.footer-nav ul li.tit{ margin-bottom:20px; text-align:center; }
.footer-nav ul li{ margin-top:10px; }
.footer-nav ul li:not(:first-child){ border-bottom:solid 1px #cfdfe8; }
.footer-nav ul li a{ display:block; }


/* footer sitemap **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.footer-snav{ padding:20px 0 40px; font-size:14px;}
.footer-snav .tit{ color:#4aacdf; }
.footer-snav ul{ width:222px; float:left; }
.footer-snav ul:not(:last-child){ margin-right:20px; }
.footer-snav ul li.tit{ margin-bottom:20px; }
.footer-snav ul li{ margin-top:10px; }
.footer-snav ul li a{ color:#fff; text-decoration:none; }
.footer-snav .wrap{position:relative;}
.footer-snav .dobnr{position:absolute; right:0px; bottom:0px;}


/* footer **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.footer{ padding:30px 0 0; margin-top:-1px; background:url(../images/base.png); position:relative; }
.footer .pagetop{ position:absolute; top:-34px; left:0; right:0; margin:0 auto; text-align:center; }
.footer .logo{ float:left; margin-bottom:10px; }
.footer .footer_menu{ float:right; font-size:12px; }
.footer .footer_menu .contact{ text-align:right; }
.footer .footer_menu ul li{ float:left; margin:10px 0 10px 20px; color:#fff; background:url("../images/footer_list.png") left 6px no-repeat; padding-left:20px; }
.footer .footer_menu ul li a{ color:#fff; text-decoration:none; }
.footer .copy{ color:#fff; font-size:10px; text-align:center; border-top:solid 1px #425865; padding:15px 0;  }


/* btn **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
/* もっと見る */
.more-btn{ display:block; height:35px; border:solid 2px #4a94df; text-indent:-9999px; background:url(../images/more_btn_off.png) center / 84px 16px no-repeat; cursor:pointer; }
.more-btn:hover{ background:#4a94df url(../images/more_btn_on.png) center / 84px 16px no-repeat; }

/* 一覧へ戻る */
.back-btn{ display:block; width:130px; height:35px; border:solid 2px #bbb; text-indent:-9999px; background:url(../images/back_btn_off.png) center / 90px 16px no-repeat; }
.back-btn:hover{ background:#bbb url(../images/back_btn_on.png) center / 90px 16px no-repeat; }

/* 取材記事を見る */
.report-btn{ display:block; width:160px; height:35px; border:solid 2px #4a94df; text-indent:-9999px; background:url(../images/report_btn_off.png) center / 120px 16px no-repeat; }
.report-btn:hover{ background:#4a94df url(../images/report_btn_on.png) center / 120px 16px no-repeat; }


/* info area **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.info-area .pr-list-area .news { margin-top:30px; }
.info-area .pr-list-area .news ul li{ position:relative; float:left; width:108px; height:35px; border-bottom: solid 2px #4aacdf; margin-bottom:10px; text-align:center; text-indent:-9999px; }
.info-area .pr-list-area .news ul li:not(:last-child){ margin-right:25px; }
.info-area .pr-list-area .news ul li:hover,.info-area .pr-list-area .news ul li.active{ background:#4aacdf; }
.info-area .pr-list-area .news ul li:hover:after,.info-area .pr-list-area .news ul li.active:after{ position:absolute; bottom:-16px; left:0; right:0; margin:0 auto; content:""; width:0; height:0; border:solid 8px; border-color:#4aacdf transparent transparent; }
.info-area .pr-list-area .news ul li a:hover,.info-area .pr-list-area .news ul li a img:hover{ opacity:1; }
.info-area .pr-list-area .news ul li a{ display:block; height:35px; cursor:pointer; background-size:120px 35px !important; }
.info-area .pr-list-area .news ul li:nth-child(1) a{ background:url(../images/news_menu1_off.png) center no-repeat; }
.info-area .pr-list-area .news ul li:nth-child(2) a{ background:url(../images/news_menu2_off.png) center no-repeat; }
.info-area .pr-list-area .news ul li:nth-child(3) a{ background:url(../images/news_menu3_off.png) center no-repeat; }
.info-area .pr-list-area .news ul li:nth-child(4) a{ background:url(../images/news_menu4_off.png) center no-repeat; }
.info-area .pr-list-area .news ul li:nth-child(5) a{ background:url(../images/news_menu5_off.png) center no-repeat; }
.info-area .pr-list-area .news ul li:nth-child(1) a:hover,.info-area .pr-list-area .news ul li.active:nth-child(1) a{ background:url(../images/news_menu1_on.png) center no-repeat; }
.info-area .pr-list-area .news ul li:nth-child(2) a:hover,.info-area .pr-list-area .news ul li.active:nth-child(2) a{ background:url(../images/news_menu2_on.png) center no-repeat; }
.info-area .pr-list-area .news ul li:nth-child(3) a:hover,.info-area .pr-list-area .news ul li.active:nth-child(3) a{ background:url(../images/news_menu3_on.png) center no-repeat; }
.info-area .pr-list-area .news ul li:nth-child(4) a:hover,.info-area .pr-list-area .news ul li.active:nth-child(4) a{ background:url(../images/news_menu4_on.png) center no-repeat; }
.info-area .pr-list-area .news ul li:nth-child(5) a:hover,.info-area .pr-list-area .news ul li.active:nth-child(5) a{ background:url(../images/news_menu5_on.png) center no-repeat; }

.info-area .pr-list-area .year select{ -webkit-appearance:none; -moz-appearance:none; appearance:none; }
::-ms-expand{ display:none; }
.info-area .pr-list-area .year select{ width:153px; height:30px; border:solid 2px #4a94df; color:#4a94df; padding:2px 10px 0; margin:14px 0 5px; background:url("../images/select_arrow_off.png") right 10px center /11px 6px no-repeat; }

.info-area .pr-list-area .month ul{ margin:5px 0 10px; margin-right:-3px; line-height:1; }
.info-area .pr-list-area .month ul li{ float:left; width:calc(100% / 12 - 3px); width:-webkit-calc(100% / 12 - 3px); height:22px; margin-right:3px; text-align:center; text-indent:-9999px; cursor:pointer; }
.info-area .pr-list-area .month ul li:nth-child(12){ margin-right:0; }

.info-area .pr-list-area .icon ul{ margin-top:20px; }
.info-area .pr-list-area .icon ul li{ line-height:22px; float:left; margin-right:20px; }
.info-area .pr-list-area .icon ul li:nth-child(1){ color:#74b2ff; }
.info-area .pr-list-area .icon ul li:nth-child(2){ color:#6571e4; }
.info-area .pr-list-area .icon ul li:nth-child(3){ color:#e95e5e; }
.info-area .pr-list-area .icon ul li:nth-child(4){ color:#ffbb17; }
.info-area .pr-list-area .icon ul li:nth-child(5){ color:#a3d04b; }

.info-area .pr-list-area .month li{ background:#f4f4f4 center / 50px 22px no-repeat; }
.info-area .pr-list-area .month li:nth-child(1){ background-image:url("../images/tag_month_1_off.png");  }
.info-area .pr-list-area .month li:nth-child(2){ background-image:url("../images/tag_month_2_off.png");  }
.info-area .pr-list-area .month li:nth-child(3){ background-image:url("../images/tag_month_3_off.png");  }
.info-area .pr-list-area .month li:nth-child(4){ background-image:url("../images/tag_month_4_off.png");  }
.info-area .pr-list-area .month li:nth-child(5){ background-image:url("../images/tag_month_5_off.png");  }
.info-area .pr-list-area .month li:nth-child(6){ background-image:url("../images/tag_month_6_off.png");  }
.info-area .pr-list-area .month li:nth-child(7){ background-image:url("../images/tag_month_7_off.png");  }
.info-area .pr-list-area .month li:nth-child(8){ background-image:url("../images/tag_month_8_off.png");  }
.info-area .pr-list-area .month li:nth-child(9){ background-image:url("../images/tag_month_9_off.png");  }
.info-area .pr-list-area .month li:nth-child(10){ background-image:url("../images/tag_month_10_off.png");  }
.info-area .pr-list-area .month li:nth-child(11){ background-image:url("../images/tag_month_11_off.png");  }
.info-area .pr-list-area .month li:nth-child(12){ background-image:url("../images/tag_month_12_off.png");  }

.info-area .pr-list-area .month li:nth-child(1).active{ background-color:#f3da68; background-image:url("../images/tag_month_1_on.png"); }
.info-area .pr-list-area .month li:nth-child(2).active{ background-color:#f3da68; background-image:url("../images/tag_month_2_on.png"); }
.info-area .pr-list-area .month li:nth-child(3).active{ background-color:#f3bb33; background-image:url("../images/tag_month_3_on.png"); }
.info-area .pr-list-area .month li:nth-child(4).active{ background-color:#f3bb33; background-image:url("../images/tag_month_4_on.png"); }
.info-area .pr-list-area .month li:nth-child(5).active{ background-color:#f2a537; background-image:url("../images/tag_month_5_on.png"); }
.info-area .pr-list-area .month li:nth-child(6).active{ background-color:#f2a537; background-image:url("../images/tag_month_6_on.png"); }
.info-area .pr-list-area .month li:nth-child(7).active{ background-color:#e38600; background-image:url("../images/tag_month_7_on.png"); }
.info-area .pr-list-area .month li:nth-child(8).active{ background-color:#e38600; background-image:url("../images/tag_month_8_on.png"); }
.info-area .pr-list-area .month li:nth-child(9).active{ background-color:#d56900; background-image:url("../images/tag_month_9_on.png"); }
.info-area .pr-list-area .month li:nth-child(10).active{ background-color:#d56900; background-image:url("../images/tag_month_10_on.png"); }
.info-area .pr-list-area .month li:nth-child(11).active{ background-color:#b64800; background-image:url("../images/tag_month_11_on.png"); }
.info-area .pr-list-area .month li:nth-child(12).active{ background-color:#b64800; background-image:url("../images/tag_month_12_on.png"); }

.info-area .pr-list-area dt{ color:#666; padding-top:23px; }
.info-area .pr-list-area dd{ list-style-image:url("../images/list.png"); border-bottom:solid 1px #e6ebeb; padding-bottom:23px; /*width:700px;*/ }
.info-area .pr-list-area dl dt{ width:calc(100% - 90px - 15px); width:-webkit-calc(100% - 90px - 15px); }

.info-area .pr-list-area dt span{ color:#666; margin-right:10px; }
.info-area .pr-list-area dt img{ vertical-align:middle; margin-right:10px; }
.info-area .pr-list-area dd{ font-size:16px; list-style-image:url("../images/list.png"); }
.info-area .pr-list-area dd br{ display:none; }
.info-area .pr-list-area .btn a{ display:block; height:35px; border:solid 2px #4a94df; text-indent:-9999px; margin-top:20px; background:url(../images/news_btn_off.png) center no-repeat; }
.info-area .pr-list-area .btn a:hover{ background:#4a94df url(../images/news_btn_on.png) center no-repeat; }



/* ★★★ タブレット ★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media only screen and (max-width: 768px){
/* init **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
body{ min-width:100%; }
img{ max-width:100%; height:auto; }
article{ padding-top: 54px; }

/* font decoration **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
/* size */
.fontSM{ font-size:10px; }
.fontM{ font-size:12px; }
.fontML{ font-size:12px; }
.fontL{ font-size:16px; }
.font26{ font-size:16px; }
.font30{ font-size:20px; }
.font32{ font-size:22px; }


/* input **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
input.sizeM{ width:100%; }
input.sizeL{ width:100%; }
textarea.sizeS{ width:100%; height:80px; }
textarea.sizeM{ width:100%; height:120px; }
textarea.sizeL{ width:100%; height:120px; }


/* movie ******
///////////////////////////////////////////////////////////////////////////////////////////////*/
.movie-frame{ position:relative; width:auto; width:100%; height:0; }
.movie-frame.ratio16by9{ padding-top:56.25%; }
.movie-frame.ratio4by3{ padding-top:75%; }
.movie-frame video, .movie-frame iframe, .movie-frame object, .movie-frame embed{ position:absolute; top:0; left:0; width:100%; height:100%; }


/* wrap **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.wrap{ width:100%; padding:0 10px; }

article div.wrap{ margin-bottom:40px; }


/* header **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.header .site { display:none; }

.header{ padding:0; /*position: fixed;*/ width: 100%; z-index:20; }
.header .top{ height:auto; padding:0 0 18px; }
.header .logo{ float:none; padding:5px 0 10px 10px; }
.header .logo a{ width:180px; height:28px; background-size:180px 28px; }
.header .top .link{ display:none; }

/*.header .rig{ width:100% !important; float:none; margin:0 auto; padding:30px 0 0; }
.header .rig .ctl{ float:none; width:100%; }
.header .rig .ctl .search{ width:calc(100% - 76px); }
.header .rig .ctl .search .search-txt{ width:calc(100% - 48px); }*/
	
/*.header .site ul{ float:left; margin:5px 0; width:100%; }

.header .site li{ width:calc(100% / 2 - 5px); width:-webkit-calc(100% / 2 - 5px); }
.header .site li a{ display:block; width:100%; background:#4a94df; text-align:center; }
*/
/*.header .site li{ width:100%; }
.header .site li a{ display:block; width:100%; background:#5ac2f8; text-align:center; }*/

/* sp gnav btn */
/*.header .sp-gnav-btn{ display:block !important; }*/


/* menu_nav **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.menu_nav { width: 100%;  }
.menu_nav li { margin:0px; }


/* slider **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.bnr-slider .slider{ width:100%; }

.bnr-slider .slider .slide-arrow{ width:15px; height:auto; }
.bnr-slider .slider .prev-arrow{ top:calc(50% - 20px); left:-20px; }
.bnr-slider .slider .next-arrow{ top:calc(50% - 20px); right:-20px; }


/* slider_banner_top **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.slider_banner_top{ padding:0 30px; }
.slider_banner_top ul{ width:100%; padding-top:60px; }

.slider_banner_top ul .slide-arrow{ width:15px; height:auto; }
.slider_banner_top ul .prev-arrow{ top:calc(50% + 15px); left:-20px; }
.slider_banner_top ul .next-arrow{ top:calc(50% + 15px); right:-20px; }

	
/* pickup **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.pickup{ margin-top:20px; padding-bottom: 20px; }
.pickup .bdr { border-left: inherit; }
.pickup li:nth-child(3) .bdr, .pickup li:nth-child(6) .bdr { border-right: inherit; }
.pickup h3 img { margin-top: 40px; }
.pickup ul{ display:block; }
.pickup li{ width:100%; position:inherit; padding-bottom:0; }
.pickup li > a{ height:260px; }
.pickup li .btn{ margin-bottom:20px !important; position:inherit; }
.pickup li .btn.num a{ width:100%; float:none; }
.pickup li .btn.num a:not(:first-child){ margin-left:0; margin-top:10px; }
.pickup li .txt_h { height: inherit; }
.pickup li .btn.num a{ display: block; width: 100%; height: 35px; border: solid 2px #4a94df; text-indent: -9999px; background: url(../images/pickup_reading_btn_off.png) center no-repeat; padding: 0 25px; }
.pickup li .btn a.shop { background:url(../images/pickup_shop_btn_off.png) center no-repeat; border: solid 2px #001534; }
.pickup li .btn a.first { background:url(../images/pickup_first_btn_off.png) center no-repeat; }
.pickup li .btn a.channel { background:url(../images/pickup_channel_btn_off.png) center no-repeat; border: solid 2px #001534; }

.pickup li .btn a{display:block;width:100%;height:35px;border:solid 2px #4a94df;text-indent:-9999px;background: url("../images/pickup_reading_btn_off.png") center no-repeat;padding:0 25px;}

/* sponsor **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.sponsor{ width: 100%; }
.sponsor li a{ height:180px; }
.sponsor li{ width:100%; float:none; }


/* footer nav **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.footer-nav{ padding:30px 0 20px; }
.footer-nav ul{ width:calc(50% - 5px); margin-bottom:10px; }
.footer-nav ul:not(:last-child){ margin-right:10px; }
.footer-nav ul:nth-of-type(even){ margin-right:0; }


/* footer sitemap **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.footer-snav{ padding:0 0 20px; }
.footer-snav ul{ width:100%; }
.footer-snav ul:not(:last-child){ margin-right:0; }
.footer-snav ul li{ border-bottom:solid 1px #425865; margin:0; font-size:12px; }
.footer-snav ul li.tit{ border-bottom:none; margin:20px 0 0; font-size:14px; }
.footer-snav ul li a{ display:block; padding:10px 0 5px; }
.footer-snav ul:last-child li:last-child{ border-bottom:none; }
.footer-snav .wrap{position:static;}
.footer-snav .dobnr{position:static; margin-top:10px;}


/* footer **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.footer .logo{ float:none; margin-bottom:20px; text-align:center; }
.footer .logo img{ width:260px; height:auto; }
.footer .footer_menu{ float:none; }
.footer .footer_menu .contact{ text-align:center; }
.footer .footer_menu ul{ margin-top:20px; }
.footer .footer_menu ul li{ float:none; margin:0; border-top:solid 1px #425865; background-position:left center; }
.footer .footer_menu ul li a{ display:block; padding:10px 0; }


/* btn **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
/* もっと見る */
.more-btn{ height:45px; }


/* info area **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.info-area .pr-list-area .news ul li{ width:calc(100% / 2 - 13px); width:-webkit-calc(100% / 2 - 13px); }
.info-area .pr-list-area .news ul li:nth-child(even){ margin-right:0px; }

.info-area .pr-list-area .month ul li{ float:left; width:calc(100% / 6 - 3px); width:-webkit-calc(100% / 6 - 3px); height:30px; margin:0 3px 3px 0; }
.info-area .pr-list-area .month ul li:nth-child(6n){ margin-right:0; }

.info-area .pr-list-area{ float:none; width:100%; margin-right:0; }
	
.info-area .pr-list-area dl dt{padding-top:10px; }
.info-area .pr-list-area dl dd{padding-bottom:10px; }

.info-area .pr-list-area dt span{ display:block; margin-right:0; }
.info-area .pr-list-area dt img{ vertical-align:middle; margin-right:10px; }

}



/* ★★★ スマホ ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media only screen and (max-width: 414px){ /* iPhone6Plus */
/* init **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
body{ min-width:300px; } /* .wrap{ padding:0 10px; } を合わせて width:320px; */


/* responsive  **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.pc-item{ display:none; }
.sp-item{ display:block; }


/* info area **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.info-area .pr-list-area .month ul li{ width:calc(100% / 4 - 3px); width:-webkit-calc(100% / 4 - 3px); }
.info-area .pr-list-area .month ul li:nth-child(6n){ margin-right:3px; }
.info-area .pr-list-area .month ul li:nth-child(4n){ margin-right:0; }


/* menu_nav **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.menu_nav { width: 100%;  }
.menu_nav li { margin:0px; }
.sp-gnav .mdropmenu li a { padding-left:20px; background: none; }
.sp-gnav .mdropmenu li.btn a{ width:100%; margin-bottom:20px; margin-left:0px; }
.sp-gnav .mdropmenu li .active { background:none; }
.sp-gnav .mdropmenu li.btn { width: 100%; padding: 0 20px; margin: 20px auto 0; }
.sp-gnav .mdropmenu li a img.s_list{ display:none; }

/* リニューアル gnav */
.menu-trigger { display: inline-block;  width: 36px;  height: 28px;  vertical-align: middle;  cursor: pointer;  position: fixed;  top: 14px;  right: 10px;  z-index: 100;/*   transform: translateX(0);  transition: transform .5s; */}
/* .menu-trigger.active { transform: translateX(-250px); }
 */
.menu-trigger span { display: inline-block;  box-sizing: border-box;  position: absolute;  left: 0;  width: 100%;  height: 4px;  background-color: #ffffff;  transition: all .5s; }
.menu-trigger.active span { background-color: #fff; }
.menu-trigger span:nth-of-type(1) { top: 0; }
.menu-trigger.active span:nth-of-type(1) { transform: translateY(5px) rotate(-45deg); }
.menu-trigger span:nth-of-type(2) { top: 8px; }
.menu-trigger.active span:nth-of-type(2) { opacity: 0; }
.menu-trigger span:nth-of-type(3){ bottom: 8px; }
.menu-trigger span:nth-of-type(4){ color: #FFF; font-size: 11px; background: none; bottom:7px; text-align: center; }
.menu-trigger span:nth-of-type(5){ display:none; }
.menu-trigger.active span:nth-of-type(4) { display:none; }
.menu-trigger.active span:nth-of-type(5) { display:block; color: #FFF; font-size: 10px; background: none; bottom:5px; }
.menu-trigger.active span:nth-of-type(3) { transform: translateY(-10px) rotate(45deg); }


/* slider_banner_top **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.slider_banner_top{ padding:0 40px; }


/* footernav **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.footer-nav ul{ width:100%; }
.footer-nav ul:not(:last-child){ margin-right:0; }


/* marine info **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.marina_weather{ padding:10px; top:0; right:0; background: url(../images/bg_marina.png); width:inherit; height:380px; }

}