@charset "utf-8";
body { font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",メイリオ,Meiryo ,Arial,Helvetica,Verdana,sans-serif, sans-serif; font-size:16px;}
a{color:#000; text-decoration:none;}
a:hover{color:#3498db;}



.container { min-height: 1500px; padding-bottom:50px/*280px*/; }
.inner{width:1140px;margin:0 auto;}

/* general */
.fsize_080{ font-size:0.80em; }
.fsize_085{ font-size:0.85em; }
.fsize_120{ font-size:1.2em; }
.fsize_130{ font-size:1.3em; }
.fsize_140{ font-size:1.4em; }
.fsize_150{ font-size:1.5em; }

.mgn_t05{ margin-top:5px;}
.mgn_t10{ margin-top:10px;}
.mgn_t15{ margin-top:15px;}
.mgn_t20{ margin-top:20px;}

.mgn_r05{ margin-right:5px;}
.mgn_r10{ margin-right:10px;}
.mgn_r15{ margin-right:15px;}
.mgn_r20{ margin-right:20px;}

.mgn_b05{ margin-bottom:5px;}
.mgn_b10{ margin-bottom:10px;}
.mgn_b15{ margin-bottom:15px;}
.mgn_b20{ margin-bottom:20px;}

.mgn_l05{ margin-left:5px;}
.mgn_l10{ margin-left:10px;}
.mgn_l15{ margin-left:15px;}
.mgn_l20{ margin-left:20px;}

/* section */
section{ padding:20px 0 0; position:relative; }
section h2{ font-size:1.2em; font-weight:500; border-bottom:solid 1px #ccc; font-family: 'メイリオ', sans-serif; position:relative; padding:5px 0;}
section h3:first-child{ border-top:none !important; }
section.flash{ /*width:250px; float:left;*/ padding-top:0; }
section.top_news{ width: 480px; word-wrap:break-word; }
section.movie, section.top_photo{ width:250px; float:left; }
section.local_news{ clear:both; }
section.global_news{}
section.ranking{ }
section.PR{font-size:13px; }
section.sport_news{}
section.leisure_news{}

#header a, #nav{  -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; }

/* header */
header#header{ display:table; padding:10px; min-width:1140px; margin:auto; border-collapse: separate; }
header#header div{ display:table-cell; vertical-align:middle;}
header#header h1.title{ font-weight:normal; width:200px; display:table-cell; vertical-align:middle; }
header#header h1.title img{ width:100%; }
header#header h1 a{ color:#000; }

/* 日時 */
.day{ text-align: center; min-width:140px;}
.day p{ line-height:1.2; margin:0 5px; }
.day p span{ display:block; font-size:1.8em; line-height:1;}
.day .day-week{}

/* weather */
.weather{ width:300px; }
.weather h3{ font-weight:normal; font-size:12px; text-align:center; background-color:#222; border-radius:3px 3px 0 0; color:#fff; }
.weather h3 a{ color:#fff; }
.weather ul{ display:table; margin:auto; border: solid 1px #ccc; border-radius:0 0 3px 3px; width:100%;}
.weather ul li{ display:table-cell; position:relative; text-align:right; border-left:solid 1px #ccc; width:33.33%;}
.weather ul li:first-child{ border-left:none; }
.weather ul li p{ font-size:13px; margin: 0 auto; display:block; text-align:left; padding:0px 45px 0px 2px; }
.weather ul li p span.temperature{font-size:1.1em; line-height:1;}
.weather a{ display:block; }
.temperature.high{ color:#F63;}
.temperature.low{ color:#69F;}
.weather .none{ display:block; background-color:#f7f7f7; height:16px; box-shadow: inset 2px 2px 5px rgba(0,0,0,0.1);}
.weather .mark{margin:1px; display:block;  border:none; text-align:center; font-size:12px; padding:0; text-shadow:0 0 1px rgba(0,0,0,0.3),0 1px 1px rgba(0,0,0,0.3),0 0 2px rgba(0,0,0,0.3);}
.mark.warning{background-color:#93c; color:#fff; /*animation:bg-color 10s infinite; -webkit-animation: bg-color 10s infinite;*/}
.mark.coution{background-color:#e74c3c; color:#fff; /*animation:bg-color 10s infinite; -webkit-animation: bg-color 10s infinite;*/}
.mark.note{background-color:#ff0; color:#000; /*animation:bg-color 10s infinite; -webkit-animation: bg-color 10s infinite;*/}
@-webkit-keyframes bg-color {
  0%   { background-color: #e74c3c; }
  20%  { background-color: #f1c40f; }
  40%  { background-color: #1abc9c; }
  60%  { background-color: #3498db; }
  80%  { background-color: #9b59b6; }
  100% { background-color: #e74c3c; }
}
@keyframes bg-color {
  0%   { background-color: #e74c3c; }
  20%  { background-color: #f1c40f; }
  40%  { background-color: #1abc9c; }
  60%  { background-color: #3498db; }
  80%  { background-color: #9b59b6; }
  100% { background-color: #e74c3c; }
}

/* フラッシュ */
section.flash h2{ position:relative; border:none; width:100px; float:left; letter-spacing:-2px; margin:10px 10px 10px 0; line-height:40px; border-right:solid 2px #000; padding:0; }
section.flash h2:after, section.flash h2:before{ content:""; margin:auto; display:block; position:absolute; top:0; bottom:0; display:none\9; }
section.flash h2:after{ right:-7px; background-color:#fff; border-style:solid; border-width: 2px 2px 0 0; width:10px; height:10px; transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg); }
section.flash p{ padding:10px 0; }

/* バナー */
.add_super{ text-align:center; margin:auto; line-height:0; }
.rectangle_area{ display:table; width:100%; padding:20px 0; }
.rectangle_area li{ display:table-cell; text-align: center; vertical-align: middle;}

/*サイズ・カラー変更*/
header#header div.size_controller{ vertical-align:middle; }
.size_controller ul{display:table; text-align:center; margin:auto; cursor:pointer;}
.size_controller h3{ font-size:0.9em; font-weight:normal; text-align:center; }
ul#textsize li{display:table-cell; padding:0 5px 10px; }
 ul#change-background-color li{display:table-cell; padding:10px; }
ul#textsize li a{ display:block; width:40px; height:40px; border-radius:50%; background:#eee; box-shadow: inset 0 1px 3px rgba(0,0,0,0.3); padding:6px; }
ul#textsize li a span{ display:block; color:#666; border-radius:50px; width:28px; height:28px; line-height:30px;background:#fff; margin:auto;}
ul#textsize li a:hover{ background:#0CF; box-shadow:0 0 6px #84E7FF,inset 0 1px 3px rgba(0,0,0,0.3); }
ul#textsize li a:hover span{ box-shadow: 0 0 8px rgba(255,255,255,0.8); }
ul#textsize li a.f1, ul#textsize li a.f2, ul#textsize li a.f3{font-size:16px;}
.f1{font-size:0.9em;}
.f2{font-size:1.0em;}
.f3{font-size:1.2em;}

/* ranking */
.ranking ol{ counter-reset:ranking; list-style:none; margin:0 0 20px 0; padding:0; }
.ranking li{ padding:5px 5px 5px 35px; border-bottom:dashed 1px #ccc; position:relative;}
.ranking li:before{ display:block; counter-increment: ranking ; content: counter(ranking); padding:3px; text-align:center; width:20px; height:20px; border-radius:100%; border:solid 1px #ccc; font-family: 'メイリオ'; font-weight:300; position:absolute; top:0; bottom:0; left:0; margin:auto;}
.ranking li:first-child:before{ border-color:Gold;}
.ranking li:first-child + *:before{ border-color:LightBlue ;}
.ranking li:first-child + * + *:before{ border-color:olive;}

/* main menu */
#nav { background: #323232; width:100%}

.mainmenu { margin: 0 auto; padding: 0; width: 1140px; font-size: 0; text-align:left; }
.mainmenu li{ padding: 0 10px; color: #fff; font-size: 16px; font-style: normal; font-weight: 600; }
.mainmenu .tab { padding: 10px; display: inline-block; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; }
.mainmenu .tab:hover { cursor :pointer; background-color: #50C4D8!important; }
.mainmenu .tab a { display: block; color: #fff; }
.mainmenu .tab a.active { font-weight: bold; color: #fff; }
.mainmenu .tab.active { background: #50c4d8; position: relative; }
.mainmenu .tab.top.active{ background: #323232; color: #fff; }

.submenu_wrapper { margin: auto; max-height: 46px; background: #50c4d8; }
.submenu_wrapper .top { height: 0; }
.submenu { margin: 0 auto; display:none; width: 1140px; transition: all 10s ease-out 0.5s; }
.submenu li{ padding: 10px 0 10px 10px; display: inline-block; }
.submenu li a{ padding: 10px 10px 10px 15px; position: relative; color: #fff; }
.submenu li a:after{ margin: auto; display: block; position: absolute; top: 0; left: 0; bottom: 0; width: 8px; height: 8px; content: ""; border-top: solid 2px #fff; border-right: solid 2px #fff; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); }

/*.fixed { position: fixed; top: 0px; box-shadow:0 2px 5px rgba(0,0,0,0.2); z-index:999; }*/

/* column */
.main_area{display:table-cell; width:800px; vertical-align:top; padding-right:40px;}
.sub_area { width:336px; display:table-cell; vertical-align:top; padding-top:10px; }

/* top news */
section.top_news .top_title{ font-size:1.4em; font-weight:normal; line-height:1.2; padding:10px 0; border-top:solid 1px #ccc; background-image:url(/images/transparent0.gif);}
section.top_news h2:first-child{border-bottom:none;}
.top_title .date{ float:left; position:relative; display:block; text-align:center; font-size:0.6em; color:#555; font-weight:bold; padding:10px 5px; width:50px; background-color:#C2EAF1; border-radius:3px; margin-right:10px;}
.top-heading-text{ float:right; width:500px; }
.top_title .date2{ border-left: 1px solid #aaa; color: #777; font-size: 0.6em; line-height: 1; margin: 0 0 0 5px; padding: 0 0 0 5px; }

/*news*/
.news_area{ float:right; width:480px; }

/*photo news*/
.top_photo .photo-img{width:250px; height:250px; padding:10px 0; position:relative; overflow:hidden; margin:10px 0; }
.top_photo .photo-img img{ position:absolute; top:-100%; left:-100%; bottom:-100%; right:-100%; margin:auto; max-width:350px; max-height:350px; }
.top_photo .photo-img img.w{ height:250px; left:-25%;}
.top_photo .photo-img img.h{ width:250px; }
.photo-img .comment{ opacity: 1; transform: translateY(250px); transition: all 0.5s ease 0s; background:rgba(80,196,216,0.8); height:auto; width:250px; padding:20px; position:absolute; bottom:0; z-index:2; color:#fff; font-weight:bold; }
.photo-img a:hover .comment{ transform: translateY(0); }
.photo-img a:after{ content:""; display:block; width:250px; height:250px; background:#000; opacity:0; position:absolute; top:0; left:0; /*transition: all 0.4s ease-in-out 0s;*/}
.photo-img a:hover:after{ opacity:0.5; }

/* カラム */
.two-column{ width:100%;}
.flex-item{ display:table; width:100%; margin-bottom:10px; }
.flex-item div{display:table-cell; width:50%;}
.flex-item div:first-child{ padding-right:10px; }
.flex-item div:first-child + *{ padding-left:10px;}

/* flexを使った段組み
.two-column{ display:flex; display:-webkit-flex; flex-wrap:wrap; flex-wrap:-webkit-wrap; width:100%;}
.two-column div{ width:50%; padding:5px; }
.flex-item{}
.through{ flex-basis:100%; -webkit-flex-basis:100%;}
*/

/* 記事下リスト */
ul.day-list{margin:10px 0; }
ul.day-list li{ border-bottom:solid 1px #ccc;}
ul.day-list li a{ display:block; font-size:0.9em; padding:5px 5px 5px 10px; position:relative; overflow:hidden;}
ul.day-list li a:after{	-webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; content:""; background-color:#50C4D8; position:absolute; display:block; width:0; height:100%; margin:auto; top:0;left:0; }
ul.day-list li a:hover:after{ width:5px; }

/* サイドリスト */
ul.aside-list{margin:10px 0; }
ul.aside-list li{ border-bottom:solid 1px #ccc;}
ul.aside-list li a{ display:block; font-size:0.75em; padding:2px 2px 2px 10px; position:relative; overflow:hidden;}
ul.aside-list li a:after{	-webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; content:""; background-color:#50C4D8; position:absolute; display:block; width:0; height:100%; margin:auto; top:0;left:0; }
ul.aside-list li a:hover:after{ width:5px; }

/* list */
.list-type1{}
.list-type1 li{ font-size:1.2em; padding:6px 0; border-bottom:solid 1px #ccc; position:relative; }
.list-type1 li a{ /*font-weight:bold;*/ font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",メイリオ,Meiryo,"ＭＳ Ｐゴシック",Osaka,"MS PGothic",Arial,Helvetica,Verdana,sans-serif;}
.list-type1 span{ display:block; font-size:0.65em; color:#333; padding:2px 5px; border-left:solid 5px #ccc; }
/*.list-type1 span:after{ content:""; width:50px; height:50px; position:absolute; display:block; background-color:#ccc; box-shadow:0 0 25px 5px rgba(0,0,0,0.5); top:40px; left:-40px; transform:rotate(45deg); } */
ul.list{}
ul.list li{ padding:10px; width:33.33%; float:left;}
.category{ margin-top: 10px; padding:5px 5px 5px 20px; border-radius:2px; position:relative; overflow:hidden; background-color:#000; color:#fff; line-height:1; font-weight:bold; }
.category:after{content:""; display:block; display:none\9; width:30px; height:30px; background-color:#50C4D8; position:absolute; top:-15px; left:-15px; z-index:1; transform:rotate(45deg); -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg); -ms-transform:rotate(45deg); box-shadow:0 0 10px #000; }
.category:before{content:""; display:block; display:none\9; width:30px; height:30px; background-color:#50C4D8; position:absolute; top:-5px; left:-18px; z-index:0; transform:rotate(20deg); -moz-transform:rotate(20deg); -webkit-transform:rotate(20deg); -o-transform:rotate(20deg); -ms-transform:rotate(20deg); }
ul.list li .category a{ padding:0; height:auto; font-size: 1.0em; border-bottom:none; color:#fff; }
ul.list li .category a:hover{color:#3498db;}
ul.list li a{ display:block; position:relative; word-wrap:break-word; border-bottom:solid 1px #ccc; padding:5px 0; height:60px; font-size:0.9em; }
ul.list li a .image{ width:100%; display:block; }
ul.list li img{ position:absolute; margin:auto; top:0; left:0; right:0; bottom:0; width:100%; z-index:1; }
ul.list li span.title2{ position:relative; display:block; }
ul.list li a p{ color:#555; font-size:0.88rem; }
section.leisure_news, section.sport_news{ }
section.leisure_news ul.list, section.sport_news ul.list{ float:left; width:50%; padding-right:10px; }
section.leisure_news ul.list li, section.sport_news ul.list li{ width:100%; height:auto; overflow:inherit; position:relative; float:none; border:none; border-bottom:solid 1px #ddd; }
section.leisure_news ul.list li a, section.sport_news ul.list li a{ height:auto; border:none; }
section.leisure_news ul.list li a .date, section.sport_news ul.list li a .date{ color:#000; display:block; }
section.leisure_news ul.list li img, section.sport_news ul.list li img{ position:relative; margin:auto; width:100px; min-height:100px; float:right; }

.list .column { border: 1px solid #ccc; display: block; overflow: hidden; position: relative; font-size:1.2em; font-weight:bold; text-align:center; padding:5px; height:100px;}
.list .column:hover { background-color: #eeeeee; }
.list .column span{ font-weight:normal; font-size:0.8em; display:block; background-color:#eee; margin-bottom:6px; }

/* 個別記事 */
.text-area{}
.text-area .title{ width:100%; margin-bottom:25px; }
.text-area .title h3{ font-weight:normal; font-size:1.6em; background-image:url(/images/transparent0.gif);}
.text-area .title .socialButtons{ text-align:right; }
.text-area .title .socialButtons li{ display:inline-block;}
.text-area .photo-box{ float:right; margin:0 0 10px 20px; }
.text-area .photo-box img{ display: block; margin: 0 auto; max-height: 350px; max-width: 350px; }
.text-area .photo-box .caption{ margin: 2px 0 10px; display: block; visibility: hidden; width: 0; max-height: 90px; line-height: 1.1em; font-size: 0.8em; }
.text-area .text-box{ line-height:1.6; background-image:url(/images/transparent0.gif);}

/* カテゴリーボタン*/
.category-menu{ -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease;}
.category-menu li{ float:left; width:50%; padding:2px; }
.category-btn { display: block; line-height: 28px; padding: 0 10px; font-size: 0.8em; position: relative; opacity: .999; border-radius: 3px;}
.btn-border-o { background-color: transparent; border: 1px solid #d0d0d0; color: #666;}
.btn-border-o:before, .btn-border-o:after { content: ''; border-style: solid; position: absolute; z-index: 5; border-radius: 3px; box-sizing: content-box;}
.btn-border-o:before { width: 0; height: 100%; border-width: 1px 0 1px 0; top: -1px; left: 0; -webkit-transition-delay: 0.05s; -moz-transition-delay: 0.05s; transition-delay: 0.05s;}
.btn-border-o:after { width: 100%; height: 0; border-width: 0 1px 0 1px; top: 0; left: -1px;}
.btn-border-o:hover:before { width: 100%;}
.btn-border-o:hover:after { height: 100%;}
.btn-border-o.btn-blue:before, .btn-border-o.btn-blue:after { border-color: #3498db; }
.btn-border-o.btn-blue:hover { color: #3498db; }

/* switch */
.switch ul{ display:table; }
.switch ul li{ display:table-cell;}
.switch ul li a{ font-family:"Oswald"; font-size:30px; color: #ccc; padding:0 20px;}
.switch ul li a:hover{ color:#000;}

/* button */
.btn{ font-size:18px; display:block; width:150px; height:60px; color:#fff; font-weight:600; line-height:60px; border-radius:10px; text-align:center; /*overflow:hidden;*/ position:relative;margin:0 8px;transform-style: flat; transition: all 250ms ease-out; }

.floating{ background-color:#09c;}
.floating:before, .floating:after { content: ""; position: absolute; z-index: -2; transition: all 250ms ease-out; }
.floating:hover{ background-color:#00bbf9;}

.button2{ border:solid 3px #aaa; border-radius:3px; height:40px; line-height:35px; position:relative; padding:0 0 0 10px; font-size:1.1em;-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; }
.button2 a{ color:#000; display:block;}
.button2:hover{ box-shadow:0 5px 15px rgba(0,0,0,0.2);}

.list-btn{ position:absolute; display:block; width:45px; height:25px; line-height:25px; background-color:#2EB9D1 !important; top:0; bottom:0; margin:auto; right:0; font-size:15px; text-align:center; color:#fff; border-radius:2px; box-shadow:0 2px 2px rgba(0,0,0,0.3); }
.list-btn:hover{ color:white; background-color:#9ddeea !important;}

.list-btn2 { position: absolute; width: 35px; height: 28px; top: 0; right: 0; line-height: 28px; -moz-backface-visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
.list-btn2:before { position: absolute; top: 0; right: 0; height:100%; width: 35px; font-size:12px; text-align:center;}
.list-btn2 { background-color: #fc2161; color: #fff; text-shadow: 0 1px 1px #b50236; -moz-transform: rotateX(0deg) translateZ(2.25em); -ms-transform: rotateX(0deg) translateZ(2.25em); -webkit-transform: rotateX(0deg) translateZ(2.25em); transform: rotateX(0deg) translateZ(2.25em);}
.list-btn2:before { content: "一覧"; font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",メイリオ,Meiryo ,Arial,Helvetica,Verdana,sans-serif, sans-serif; background-size: 100%; background-image: -moz-linear-gradient(45deg, #ce033e 0%, #eb1f56 50%, #f91858 50%, #fc2161); background-image: -webkit-linear-gradient(45deg, #ce033e 0%, #eb1f56 50%, #f91858 50%, #fc2161); background-image: linear-gradient(45deg, #ce033e 0%, #eb1f56 50%, #f91858 50%, #fc2161); }
.list-btn2:hover{ opacity:0.8; color:#fff;}

/* Paper effect – slightly raised off background */
.paper { box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(128, 128, 128, 0.1) inset; border-color: #dedede; color:#000; }
.paper-raise-flatten { color:#000; border-color: #fff; box-shadow: none; background-color:#f7f7f7;}
.paper-raise-flatten:before { content:""; display:block; position:absolute; border-radius:10px; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 15px 10px -10px rgba(31, 31, 31, 0.3);}
.paper-raise-flatten:hover { border-color: #dedede;}
.paper-raise-flatten:hover:before { box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(128, 128, 128, 0.1) inset; }

/*グラデーション変化*/
.gradient { overflow: hidden; letter-spacing: 2px;}
.gradient:after { position: absolute; content:''; display: inline-block; background: rgba(59,173,227,1); background: linear-gradient(45deg, rgba(59,173,227,1) 0%, rgba(87,111,230,1) 25%, rgba(152,68,183,1) 51%, rgba(255,53,127,1) 100%); height: 60px; width: 372px; z-index: -1; transform: translateX(-280px); transition: transform 400ms ease-in; }
.gradient:hover:after { transform: translateX(-200px); }

/*波形グラデーション*/
.wave{ z-index: 1; background: #ed1c5b; border: none; transition: box-shadow 400ms cubic-bezier(.2,0,.7,1), transform 200ms cubic-bezier(.2,0,.7,1); }
.wave:hover{ box-shadow: 0 0 1px 5px rgba(237,28,91,0.1), 0 0 1px 10px rgba(237,28,91,0.1), 0 0 1px 15px rgba(237,28,91,0.1); }

/*浮き上がり*/
.material { background-color:#09c; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); transition: color 0.2s ease, background-color 0.2s ease, transform 0.3s ease; }
.material:after { z-index:-1; background-color:#fff; background-color:#09c\9;  content: ""; width: 150px; height: 60px; transform: scale(1); position: absolute; top: 0; left: 0; border-radius: 10px; transition: all 0.3s ease; border:solid 3px #09c; box-sizing:border-box; }
.material:hover:after { transform: scale(1.05); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);}
.material:hover { background-color: transparent; background-color:#0CF\9; cursor: pointer; box-shadow: none; }

/*ページ送り*/
.next{ background-color:#2eb9d1; margin:0; border-radius:0 10px 10px 0; position:relative; }
.prev{ background-color:#F66; margin:0; border-radius:10px 0 0 10px; position:relative; }
.next:after, .prev:after{ content:""; display:block; width:15px; height:15px; position:absolute; top:0; bottom:0; margin:auto; border-style:solid; opacity:0; border-color:#fff; transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -ms-transform:rotate(45deg);}
.next:after{right:15px; border-width:3px 3px 0 0;}
.prev:after{left:15px; border-width:0 0 3px 3px;}
.next:hover, .prev:hover{ box-shadow: inset 0 20px 40px rgba(0,0,0,0.3); color:#f7f7f7;}
.next:hover:after, .prev:hover:after{ opacity:1;}
.layout-table{ display:table; margin: 20px auto;}
.layout-table p{ display:table-cell; }

/*メインカラム下部リスト*/
/*
.mybestpro h2 { padding-left:140px; }
.mybestpro h2 img{ position:absolute; margin:auto; top:10px; left:0; }
*/
.mybestpro h2 img{ width:130px;vertical-align:middle; }

/* clearfix */
.cf:before,
.cf:after{ content:""; display: table;}
.cf:after{ clear:both; }

/*プレゼント*/
section.present_area{ border: solid 1px #ccc; padding:5px; }
.application{ float:right; width:160px; font-weight:600; }
.present_area h3{ font-size:1.0em; line-height:1.1; margin: 6px 0;}
.application p{ margin:0 0 6px 0; }
.present_area .period{ border-radius:50px; background:#2eb9d1; color:#fff; text-align:center; line-height:1; padding:5px; }
.present_area .gift_item{ float:left; width:150px; }
.gift_item img{ display:block; max-height:150px; max-width:150px; margin:auto;}

/* icon */
i{ margin-right:1px; }
/*
i{ diplay:block; height:30px; width:30px; position:relative; float:left; margin-right:2px; }
i:before{ position:absolute; margin:auto; top:0; bottom:0; left:0; right:0; }
i:before, i:after{ box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }

.mail{ position:relative; font-size:1.2em; padding:0 0 0 40px;}
.mail span{ display:block; position:absolute; background:#fff; border-radius:3px; border:solid 3px #aaa; left:0; top:0; bottom:0; margin:auto 5px; width:30px; height:22px; overflow:hidden; }
.mail span:before, .mail span:after{ content:""; display:block; position:absolute; width:15px; height:15px; border:solid 3px #aaa; transform:rotate(45deg); transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); -ms-transform:rotate(45deg); margin:auto; left:0; right:0; background:#fff;}
.mail span:before{ z-index:2; top:-11px;}
.mail span:after{ z-index:1; bottom:-11px; }

.present{ left:5px; top:12px; display:inline-block; height: 0.5em; width: 1em; font-size: 14px; position: absolute; background: #aaa;
	-webkit-box-shadow: 0 0.1em 0 0 #aaa,0 0.8em 0 0 #aaa,0 0.9em 0 0 #aaa,1.2em 0.9em 0 0 #aaa,1.2em 0.8em 0 0 #aaa,1.2em 0.1em 0 0 #aaa,1.2em 0em 0 0 #aaa,1.3em -0.2em 0 -0.01em #aaa,1.2em -0.2em 0 -0.01em #aaa,0em -0.2em 0 -0.01em #aaa,-0.1em -0.2em 0 -0.01em #aaa;
	box-shadow: 0 0.1em 0 0 #aaa,0 0.8em 0 0 #aaa,0 0.9em 0 0 #aaa,1.2em 0.9em 0 0 #aaa,1.2em 0.8em 0 0 #aaa,1.2em 0.1em 0 0 #aaa,1.2em 0em 0 0 #aaa,1.3em -0.2em 0 -0.01em #aaa,1.2em -0.2em 0 -0.01em #aaa,0em -0.2em 0 -0.01em #aaa,-0.1em -0.2em 0 -0.01em #aaa;}
.present:before { left: 1.1em; top: -0.8em; height: 0.5em; width: 0.2em; content: ''; display: block; position: absolute; border: 0.15em solid #aaa; border-left: 0.05em solid #aaa; border-radius: 50%; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}
.present:after { left: 0.7em; top: -0.8em; height: 0.5em; width: 0.2em; content: ''; display: block; position: absolute; border: 0.15em solid #aaa; border-right: 0.05em solid #aaa; border-radius: 50%; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }

.camera{ position:relative; width:30px; height:20px; border-radius:2px; background:#000;display:inline-block; top:5px; }
.camera:before, .camera:after{ content:""; position:absolute; display:block; }
.camera:before{ z-index:1; width:14px; height:14px; border:solid 3px #fff; border-radius:50%; top:0; bottom:0; margin:auto; right:5px; box-shadow:-9px -14px 0 -5px #000;}
.camera:after{z-index:2; width:28px; height:3px; background:#000; border-radius:50px; top:-4px; margin:auto; left:0; right:0; }

.home{ position:relative; width:30px; height:20px;display:inline-block; top:5px; }
.home:before, .home:after{ content:""; position:absolute; display:block; }
.home:before{ width:5px; height:5px; background:#000; color:#000; left:0; right:0; top:0; bottom:0; margin:auto; box-shadow:5px 0 0, 5px 4px 0, -5px 0 0, -5px 4px 0;}
.home:after{ width:0; height:0; border:solid 11px transparent; border-bottom: 11px solid #000; top:-11px; margin:auto; left:0; right:0;}
.menu-btn:hover i.home:before {background:#eee;}
.menu-btn:hover i.home:after{ border-bottom-color:#eee; }

.local{ position:relative; width:12px; height:20px;display:inline-block; top:3px; margin-right:5px; overflow:hidden; }
.local:before, .local:after{ content:""; position:absolute; display:block; }
.local:before { width:5px; height:5px; background-color:#000; right:0; top:7px; box-shadow: -2px -5px 0, -3px -5px 0, -5px -2px 0, -5px 3px 0, -5px 6px 0; }
.local:after { width:3px; height:3px; top:0; right:0; background-color:#000; box-shadow:-3px 11px 0, -9px 12px 0, -7px 17px 0; }
.menu-btn:hover i.local:before, .menu-btn:hover i.local:after{background-color:#eee; box-shdow-color:#eee; }

.global{ position:relative; width:20px; height:20px;display:inline-block; top:5px; border:solid 2px #000; border-radius:50%; margin-right:5px; overflow:hidden; }
.global:before, .global:after{ content:""; position:absolute; display:block; }
.global:before{ width:10px; height:20px; border:solid 2px #000; border-radius:50%; margin:auto; top:-2px; left:0; right:0; bottom:0; }
.global:after{ width:20px; height:10px; border:solid 2px #000; border-radius:50%; margin:auto; top:0; left:-2px; right:0; bottom:0; }
.menu-btn:hover i.global, .menu-btn:hover i.global:before, .menu-btn:hover i.global:after{border-color:#eee; }

.news{ position:relative; width:17px; height:20px;display:inline-block; top:5px; border:solid 2px #000; border-radius:0 0 5px 0; margin-right:5px; overflow:hidden; }
.news:before, .news:after{ content:""; position:absolute; display:block; }
.news:before{ width:10px; height:2px; margin:auto; top:-0; left:0; right:0; bottom:0; background:#000; box-shadow:0 -4px 0 #000;}
.news:after{ width:10px; height:10px; bottom:-5px; right:-5px; border:solid 2px #000;}
.menu-btn:hover .news, .menu-btn:hover .news:after{ border-color:#eee; }
.menu-btn:hover .news:before{ background:#eee; box-shadow:0 -4px 0 #eee;}

.nano{ position:relative; width:20px; height:20px;display:inline-block; top:5px; border:solid 2px #000; border-radius:10px 10px 10px 0; margin-right:5px; overflow:hidden; transform:rotate(-25deg); }
.nano:before, .nano:after{ content:""; position:absolute; display:block; }
.nano:before{ width:50px; height:50px; margin:auto; top:-1px; left:-1px; border:solid 1px #000; border-radius:50%; background:#000;}
.menu-btn:hover .nano{ border-color:#eee; }
.menu-btn:hover .nano:before{ background:#eee; border-color:#eee;}

.crown{ position:relative; width:20px; height:4px; border-radius:20px; display:inline-block; background:#000; bottom:0; margin-right:5px;}
.crown:before, .crown:after{ content:""; position:absolute; left:-3px; display:block;}
.crown:before{ width:4px; height:4px; margin:auto; top:-18px; border-radius:50%; background:#000; box-shadow: 10px 0 0 #000, 20px 0 0 #000;}
.crown span{ display:block; width:20px; height:14px; position:absolute; top:-15px; overflow:hidden;}
.crown span:after{ content:""; display:block; height:15px; width:15px; background-color:#000; transform:rotate(45deg); -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); -o-transform:rotate(45deg); -ms-transform:rotate(45deg); top:4px; left:-18px; position:absolute; box-shadow:7px -7px  0 #000, 14px -14px 0 #000, 22px -22px 0 #000;}

.shinmai{ position:relative; width:20px; height:20px;display:inline-block; top:5px; margin-right:5px; overflow:hidden;}
.shinmai:before, .shinmai:after{ content:""; position:absolute; display:block; }
.shinmai:before{ width:10px; height:2px; background-color:#000; top:0; right:0;box-shadow: 0 18px 0, -10px 18px 0, -14px 4px 0, -5px 0 0, -3px 4px 0, 0 0, -3px 8px 0, -3px 12px 0; }
.shinmai:after{ width:2px; height:2px; background-color:#000; top:0px; right:0; box-shadow:0 2px,0 4px,0 6px, 0 8px,0 10px, 0 12px, 0 14px, 0 16px, -14px 0, -14px 2px, -14px 4px, -15px 8px, -15px 12px, -9px 16px, -7px 16px, -5px 16px, -18px 6px, -18px 8px, -18px 10px, -18px 12px, -18px 14px, -18px 16px;}
.menu-btn:hover .shinmai:before, .menu-btn:hover .shinmai:after{ background:#eee; }

i.flash{ position:relative; width:20px; height:20px; display:inline-block; background:#000; margin-right:5px;}
i.flash:before, i.flash:after{ content:""; position:absolute; display:block; }
i.flash:before{ width:20px; height:20px; top:0; background:#000; transform:rotate(60deg); -moz-transform:rotate(60deg); -webkit-transform:rotate(60deg); -o-transform:rotate(60deg); -ms-transform:rotate(60deg);}
i.flash:after{  width:20px; height:20px; top:0; background:#000; transform:rotate(120deg); -moz-transform:rotate(120deg); -webkit-transform:rotate(120deg); -o-transform:rotate(120deg); -ms-transform:rotate(120deg);}
*/
.sizeS{ transform:scale(0.8);}
.sizeM{ transform:scale(0.9);}
.sizeL{ transform:scale(1.2);}

/* 検索 */
.search{ display:table;}
.search p{ display:table-cell;}

.search input[type="text"] {
	border-radius:3px 0 0 3px;
	padding:5px;
	property: value;
	border:solid #2eb9d1;
	border-width:2px 0 2px 2px;
	width:280px;
	height:36px;
	color:#777;
	 -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease;
}

.search input[type="text"]:focus{ box-shadow: 0 0 10px rgba(0,0,0,0.3); }

.search input[type="submit"] {
	-moz-backface-visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden;
	background-color:#2eb9d1;
	color:#fff;
	border-radius:0 3px 3px 0;
	background-size: 100%; background-image: -moz-linear-gradient(-45deg, #2594a7 0%, #2aaac0 50%, #2cb2c9 50%, #2eb9d1); background-image: -webkit-linear-gradient(-45deg, #2594a7 0%, #2aaac0 50%, #2cb2c9 50%, #2eb9d1); background-image: linear-gradient(-45deg, #2594a7 0%, #2aaac0 50%, #2cb2c9 50%, #2eb9d1);
 	width:100%;
	width:56px;
	height:36px;
	cursor:pointer;
}

.search input[type="submit"]:hover{ opacity:0.7;}

/* 観光ナビ */
.topNews { background-color: #ccc; color: #fff; margin: 5px auto; height: 200px; overflow: hidden; position: relative; width: 275px; }
.topNews > a > a { display: block; }
.topNews a { color: #fff !important; text-align: center; }
.topNews a img { width:100%; transition: all 0.6s ease 0s; }
.topNews a:hover img { transform: scale(1.08); }
.topNewsTtl { background: rgba(0, 0, 0, 0.4) none repeat scroll 0 0; bottom: 0; display: block; left: 0; padding: 10px; position: absolute; text-align: left; width: 100%; }

/*フォトニュース*/
#photo_thumb{ display:none; }
.top_photo ul{ display:block; }
.top_photo ul li{ display:block; positon:relative; float:left; width:83.33333333333px; height:83.333333333333px; }
.top_photo ul li img{ width:100%; height:100%; object-fit:cover; }

/*パンくずリスト*/
ul.breadcrumb { margin-left: 18px; display: inline-block; font-size:0.8em;}
ul.breadcrumb li { float: right; padding: 5px; background-color: #fff/*#59A386*/; border-radius: 30px; position: relative; margin-left: -30px; /*transition: all 0.2s; margin-top: 3px;*/}
ul.breadcrumb li a,
ul.breadcrumb li:first-child span { overflow: hidden; border-radius: 30px;  -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; text-decoration: none; height: 30px; color: #509378; background-color: #efefef; text-align: center; display: block; line-height: 30px; padding-left: 32px; padding-right: 33.33333px; }
ul.breadcrumb li:first-child span{ width: auto; background-color: #CCFF99; }
ul.breadcrumb li a:hover { background-color: #ccff99; }
ul.breadcrumb li.home a { padding: 0; background-color: #e4e4e2; width:30px; color:#000;}
ul.breadcrumb li.home:hover a { /*width: 40px; height: 40px; line-height: 40px;*/ background-color: #ccff99; }

/*バナー*/
section.banner{text-align:center; padding:0; }

/*カレンダー*/
.calendar-container { position: relative; width: 100%; }
.calendar-container header { height:40px; line-height:40px; text-align:center; }
.year { font-size: 13px; }
.month { font-size: 18px; }
.calendar { background: ; color: #555; width:100%; border-collapse: separate;  table-layout:fixed; }
.calendar thead { color:/* #e66b6b*/; font-weight: 700; }
.calendar thead td{ background:#fff; }
.calender tbody{ padding:10px; }
.calendar td { text-align: center; border-bottom:solid 1px ; position:relative; height:35px; line-height:35px; }
.calendar tbody td:after{ content:""; display:block; width:5px; height:5px; background-color:#ccc; position:absolute; left:0; right:0; bottom:-3px; margin:auto; border-radius:50%;}
.calendar tbody td a{ display:block; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease;}
.calendar tbody td a:hover { background: #cacaca; color: #fff; }
.calendar tbody td a.today{ background-color:#dedede;}
.current-day { color: #e66b6b; }
.calendar tbody td.prev-month:after,
.calendar tbody td.next-month:after{ display:none; }
.prev-month, .next-month { color: #cacaca; }
.ring-left, .ring-right { display:table-cell; width:190px; text-align:center; }
.ring-left a, .ring-right a{ height:30px; display:block; line-height:30px; position:relative; }
.ring-left a:hover, .ring-right a:hover{ background: #0cf; color:#fff; }
.ring-left a{ border-radius:0 0 0 5px; }
.ring-left a:before{ content:""; display:block; display:none\9; width:20px; height:4px; background:#999; position:absolute; border-radius:0 3px 3px 0 ; top:50%; margin-top:-2px; left:20px;}
.ring-left a:after{ content:""; display:block; display:none\9; height:4px; width:4px; border-radius:3px; background:#999; position:absolute; transform:rotate(45deg); -moz-transform:rotate(45deg); -webkit-transform:rotate(45deg); top:50%; margin-top:-2px; left:15px; box-shadow: 1px 0px 0 #999, 2px 0px 0 #999, 3px 0px 0 #999, 4px 0px 0 #999, 5px 0px 0 #999, 6px 0px 0 #999, 7px 0px 0 #999, 8px 0px 0 #999, 9px 0px 0 #999, 10px 0px 0 #999, 0px -1px 0 #999, 0px -2px 0 #999, 0px -3px 0 #999, 0px -4px 0 #999, 0px -5px 0 #999, 0px -6px 0 #999, 0px -7px 0 #999, 0px -8px 0 #999, 0px -9px 0 #999, 0px -10px 0 #999; }
.ring-right a:before{ content:""; display:block; display:none\9; width:20px; height:4px; background:#999; position:absolute; border-radius:3px 0 0 3px ; top:50%; margin-top:-2px; right:20px; }
.ring-right a:after{ content:""; display:block; display:none\9; height:4px; width:4px; border-radius:3px; background:#999; position:absolute; transform:rotate(225deg); -moz-transform:rotate(225deg); -webkit-transform:rotate(225deg); top:50%; margin-top:-2px; right:15px; box-shadow: 1px 0px 0 #999, 2px 0px 0 #999, 3px 0px 0 #999, 4px 0px 0 #999, 5px 0px 0 #999, 6px 0px 0 #999, 7px 0px 0 #999, 8px 0px 0 #999, 9px 0px 0 #999, 10px 0px 0 #999, 0px -1px 0 #999, 0px -2px 0 #999, 0px -3px 0 #999, 0px -4px 0 #999, 0px -5px 0 #999, 0px -6px 0 #999, 0px -7px 0 #999, 0px -8px 0 #999, 0px -9px 0 #999, 0px -10px 0 #999; }
.ring-left a:hover:before,
.ring-right a:hover:before,
.ring-left a:hover:after,
.ring-right a:hover:after{ background:#fff; }
.ring-left a:hover:after{ box-shadow: 1px 0px 0 #fff, 2px 0px 0 #fff, 3px 0px 0 #fff, 4px 0px 0 #fff, 5px 0px 0 #fff, 6px 0px 0 #fff, 7px 0px 0 #fff, 8px 0px 0 #fff, 9px 0px 0 #fff, 10px 0px 0 #fff, 0px -1px 0 #fff, 0px -2px 0 #fff, 0px -3px 0 #fff, 0px -4px 0 #fff, 0px -5px 0 #fff, 0px -6px 0 #fff, 0px -7px 0 #fff, 0px -8px 0 #fff, 0px -9px 0 #fff, 0px -10px 0 #fff;}
.ring-right a:hover:after{ box-shadow: 1px 0px 0 #fff, 2px 0px 0 #fff, 3px 0px 0 #fff, 4px 0px 0 #fff, 5px 0px 0 #fff, 6px 0px 0 #fff, 7px 0px 0 #fff, 8px 0px 0 #fff, 9px 0px 0 #fff, 10px 0px 0 #fff, 0px -1px 0 #fff, 0px -2px 0 #fff, 0px -3px 0 #fff, 0px -4px 0 #fff, 0px -5px 0 #fff, 0px -6px 0 #fff, 0px -7px 0 #fff, 0px -8px 0 #fff, 0px -9px 0 #fff, 0px -10px 0 #fff; }
.ring-right a{ border-radius:0 0 5px 0; }
.pattern1{ background-color:#f7f7f7; }
.pattern2{}

#calendar #back,
#calendar #forward { display: inline-block; width: 60px; font-size: 13px; }
#calendar #source { margin: 5px 0 0 0;  font-size: 15px;}
#calendar #source input[type=radio] { margin: 0 0 0 18px; -webkit-appearance: radio; }

/* footer */
footer#footer{  clear:both; font-size:0.85rem; /*background:#f7f7f7;*/ width:100%; min-width:1140px; /*position:absolutefixed; bottom:0 -240px; z-index:999; */height:220px; background-color:#333;}
footer.visible {bottom:0 !important; }
#footer .footer-inner{ width:1140px; margin:auto; color:#CCC;}
#footer .footer-inner a{ color:#ccc;}
#footer .copyright{padding:20px 0 10px; }
#footer #footer47news{ width:1140px; margin:auto; padding:20px 0; font-size:0.9em; color:#eee;}
#footer #footer47news a{ color:#ccc; }
#footer #footer47news a:hover, #footer .footer-inner a:hover{ color:#2eb9d1; }

/* SNSボタン */
#socialbutton{ overflow: visible; padding: 10px 0 20px; }
#socialbutton li{
	display: inline-block;
	margin-right: 5px;
	vertical-align: top;
	float: right;
	line-height: 1;
	*display: inline;   <!-- IE用のハック -->
	zoom: 1;        <!-- IE用の hasLayout を true にするための記述 -->
}
.fb_iframe_widget > span { vertical-align: baseline !important; }
.gplus { width: 50px; }

/* 広告 */
.PR li{ background:url("/images/top/pr_bg.gif") no-repeat left center;padding-left:22px; }
.nano-notes{ margin-left:6px; font-size: 13px; font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",メイリオ,Meiryo ,Arial,Helvetica,Verdana,sans-serif, sans-serif; font-weight: normal}
.ranking-notes{ margin:20px; padding:20px 20px 20px 43px; border:1px dashed #ccc; font-size: 13px; text-indent: -1em;}

/* SNSのリンク */
.sns-list{border-bottom:1px solid #ccc;}
.snslink{vertical-align: middle}
img.snslink{display:inline-block}

/*なーのちゃんおでかけ*/
.schedule > h5{ font-weight: normal; font-size: 18px; margin-left: 10px; margin-bottom: 10px}
.nanochango{ width: 740px; margin: 0 auto }
.nanodate{ line-height:1.6em; text-align: right; float: left; clear:both}
.nanogo{ line-height:1.6em; margin-bottom: 10px; border-bottom: 1px solid #ccc; padding-left: 140px; }

p{background-image:url(/images/transparent0.gif);}

/* 20180119 Newspack List */
.nplist .item{ margin:40px 0 40px 0; }
.nplist .head{ display:table;border-bottom:1px solid #ccc;width:100%; }
.nplist .title{ display:table-cell;font-size:1.2em; }
.nplist .date{ display:table-cell;font-size:0.8em;vertical-align:bottom;text-align:right; }
.nplist .text{ font-size:1.0em; }
.nppage .item{ border:1px solid #ccc;border-radius:3px;text-align:center;width:40px;padding:10px;font-size:1.0em;line-height:1.0em;display:inline-block; }
.nppage span:not(.now):hover{ border-color:#3498db; }
.nppage .now{ background-color:#ccc; }


