@charset "EUC-JP";

/* --------------------------
* misc
-------------------------- */
/* section */
.section {padding: 50px 75px 0;}
.section > .inner {margin: 0 auto;max-width: 1600px;}
.section > h1.title {position: relative;text-align: center; font-size: 24px;font-weight: bold;line-height: 1em;margin-bottom: 75px;}
.section > h1.title::before { content: ''; position: absolute; bottom: -25px;left: 50%;width: 20px; margin-left: -10px;height: 3px; background-color: #1DACE0;}
@media screen and (max-width: 767px) {
    .section {padding:0px 20px;}
    .section > h1.title {font-size: 18px;}
}

/* mainVisual */
#mainVisual {margin-top: 140px;background-color: #333; position: relative;display: block;width: 100%; height: 250px;background-position: center bottom; background-repeat: no-repeat; background-size: cover;}
#mainVisual.event {background-image: url(../images/event/mv.jpg);}
#mainVisual.spot {background-image: url(../images/spot/mv.jpg);}
#mainVisual.seminar {background-image: url(../images/seminar/mv.jpg);}
#mainVisual.holiday {background-image: url(../images/holiday/mv.jpg);}
#mainVisual.holiday.cycling {background-image: url(../images/holiday/mv_01.jpg);}
#mainVisual.holiday.camp {background-image: url(../images/holiday/mv_02.jpg);}
#mainVisual.holiday.hiking {background-image: url(../images/holiday/mv_03.jpg);}
#mainVisual.holiday.fishing {background-image: url(../images/holiday/mv_04.jpg);}
#mainVisual.holiday.photo {background-image: url(../images/holiday/mv_05.jpg);}
#mainVisual.holiday.diamond {background-image: url(../images/holiday/mv_06.jpg);}
#mainVisual.other {background-image: url(../images/other/mv.jpg);}
#mainVisual.kun {background-image: url(../images/zekkei/mv_kun.jpg);}
#mainVisual.chan {background-image: url(../images/zekkei/mv_chan.jpg);}
#mainVisual.zekkei {background-image: url(../images/zekkei/mv_01.jpg);}
#mainVisual p {position: absolute; top: 25px; left: 50%;margin-left: -25px;width: 50px; height:50px;display: block;}
#mainVisual p img { width: 100%;height: auto;display: block;}
#mainVisual h1 { color: #fff;padding-top: 75px;}
#mainVisual h1 dl { text-align: center;width: 1000px; margin:0 auto;padding: 0;}
#mainVisual h1 dl dt {font-weight: bold;margin: 0;padding: 0;display: block; font-size: 28px;padding: 20px 20px 45px; position: relative;}
#mainVisual h1 dl dt span {width: 70px; height: auto;display: block; position: absolute; bottom: 8px;left: 50%;margin-left: -35px;}
#mainVisual h1 dl dt span img {width: 100%;height: auto; display: block;}
#mainVisual h1 dl dd {margin: 0;padding: 20px;display: block;font-size: 14px;letter-spacing: 1px;}
#mainVisual h2 {width: 60px;height: auto; position: absolute;right: 30px; bottom: 30px;display: block;}
#mainVisual .crumbs { position: absolute; right: 30px;top: 30px; line-height:30px; height: 30px;width: 100%;display: block;}
#mainVisual .crumbs ul {font-size: 0;text-align: right;}
#mainVisual .crumbs ul li {display: inline-block;padding: 0 5px;color: #fff;font-size: 11px;letter-spacing: 0.5px;}
#mainVisual .crumbs ul li a {color: #fff;}
#mainVisual .crumbs ul li a:hover {color: #fff; text-decoration: underline;}
#mainVisual::after {content: '';z-index: 99;width: 100%; height: 4px;background-color: #000; position: absolute;bottom:0px;left: 0;background-image: url(../images/common/line.png);background-position: center; background-size:150px 15px;display: block;}
@media screen and (max-width: 767px) {
    #mainVisual {margin-top: 60px;color: #333; position: relative;display: block;width: 100%; height: 250px;}
    #mainVisual.event {background-image: url(../images/event/mv_sp.jpg);}
    #mainVisual.spot {background-image: url(../images/spot/mv_sp.jpg);}
    #mainVisual.seminar {background-image: url(../images/seminar/mv_sp.jpg);}
    #mainVisual.holiday {background-image: url(../images/holiday/mv_sp.jpg);}
    #mainVisual.holiday.cycling {background-image: url(../images/holiday/mv_01_sp.jpg);}
    #mainVisual.holiday.camp {background-image: url(../images/holiday/mv_02_sp.jpg);}
    #mainVisual.holiday.hiking {background-image: url(../images/holiday/mv_03_sp.jpg);}
    #mainVisual.holiday.fishing {background-image: url(../images/holiday/mv_04_sp.jpg);}
    #mainVisual.holiday.photo {background-image: url(../images/holiday/mv_05_sp.jpg);}
    #mainVisual.holiday.diamond {background-image: url(../images/holiday/mv_06_sp.jpg);}
    #mainVisual.other {background-image: url(../images/other/mv_sp.jpg);}
    #mainVisual.kun {background-image: url(../images/zekkei/mv_kun_sp.jpg);}
    #mainVisual.chan {background-image: url(../images/zekkei/mv_chan_sp.jpg);}
    #mainVisual.zekkei {background-image: url(../images/zekkei/mv_01_sp.jpg);}
    #mainVisual p {position: absolute; top: 20px; left:50%;margin-left: -17px;width: 35px; height:35px;display: block;}
    #mainVisual h1 {padding-top: 55px;}
    #mainVisual h1 dl { text-align: center;width: auto; margin:0 40px;padding: 0;}
    #mainVisual h1 dl dt {margin: 0;padding: 0;font-size: 18px;padding: 15px 15px 30px; }
    #mainVisual h1 dl dt span {width: 50px; margin-left: -25px;bottom: 5px;}
    #mainVisual h1 dl dd {padding: 15px 0;font-size: 12px; line-height: 1.8em; text-align: left; letter-spacing: 0;}
    #mainVisual h2 {width: 40px;height: auto; position: absolute;right: 20px; top: 20px;display: block;}
    #mainVisual .crumbs { position: absolute; right: 0px;bottom: 10px; top:inherit; height: 30px;width: 100%;overflow-x: scroll;display: block;white-space: nowrap;}
    #mainVisual .crumbs ul {font-size: 0;text-align: center;padding: 0 20px;}
    #mainVisual .crumbs ul li {padding: 0 5px;font-size: 10px;}
}

@media screen and (max-width: 767px) {
    #content {margin-top: 25px;}
}

#map { width: 100%; height: 500px;display:block;margin: 0;padding: 0;background-color: #eee;}

.crumbs.bottom {background-color: #f9f9f9;height: 42px;line-height:40px;width: 100%;display: block;margin:0px;border-top: 1px solid #eee;border-bottom: 1px solid #eee;}
.crumbs.bottom ul {font-size: 0;text-align: left;padding: 0 100px;}
.crumbs.bottom ul li {display: inline-block;padding: 0px;color: #333;font-size: 11px;padding-right: 10px;}
.crumbs.bottom ul li a {color: #333;}
.crumbs.bottom ul li a:hover {color: #333; text-decoration: underline;}
@media screen and (max-width: 767px) {
    .crumbs.bottom {line-height:30px;height: 32px;width: 100%;margin-top: 0px;overflow-x: scroll;display: block;white-space: nowrap;}
    .crumbs.bottom ul {text-align: center;padding: 0 10px;}
    .crumbs.bottom ul li {padding: 0 5px;font-size: 10px;}
}

#pageNav {background-color: #fff999;padding: 20px 100px;position: relative;}
#pageNav h1 {font-family: 'Lato', sans-serif;font-weight: 400; letter-spacing: 1.5px;text-align: center;font-size: 20px;position: absolute;top: 0;left: 0;width: 100%;line-height: 1em;margin-top: -12px;}
#pageNav ul {font-size: 0;margin: 0 -5px;}
#pageNav ul:before,
#pageNav ul:after {content:"";display:table;}
#pageNav ul:after {clear:both;}
#pageNav ul li {width: 33.333%;display:block;float: left;margin: 0;padding:5px;}
#pageNav ul li a { position:relative; line-height: 50px;display: block; height: 70px;width: 100%;color: #fff; font-weight: bold;font-size:16px;padding:10px 20px;box-sizing: border-box;-webkit-box-sizing: border-box;border-radius:5px;-webkit-border-radius:5px;overflow: hidden;}
#pageNav ul li a::before {position: absolute;top: -100px;left: 0;width: 100%;height: 100%; background-color: rgba(255,255,255,0.25);display: block;content:'';transition:all .3s ease;-webkit-transition:all .3s ease;}
#pageNav ul li a img {width:50px;float: left;margin-right: 20px;}
#pageNav ul li a .fa {font-size: 32px; position: absolute; top: 50%;line-height: 1em;margin-top: -18px;right: 20px;}
#pageNav ul li a:hover::before{top:0px;}
#pageNav ul li:nth-of-type(1) a {background-color:#FFAD3B;}
#pageNav ul li:nth-of-type(2) a {background-color:#1DACE0;}
#pageNav ul li:nth-of-type(3) a {background-color:#EF584C;}
#pageNav ul li:nth-of-type(4) a{background-color:#AF59D4;}
#pageNav ul li:nth-of-type(5) a {background-color:#06C286;}
#pageNav ul li:nth-of-type(6) a {background-color: #cfa972;}
@media screen and (max-width: 767px) {
    #pageNav {display: none;}
}

/* --------------------------
* lead
-------------------------- */
.lead {padding:75px 100px 50px;}
.lead .container {margin: 0 auto;max-width: 1600px;min-width: 1000px;padding-right:12%;position:relative;display: block;}
.lead .container figure {position:absolute; bottom: -50px; width: 20%;right: 0px;z-index: 99;}
.lead .container .inner {background-color: #fff;font-size: 16px;line-height: 2em;padding: 30px 100px 30px 50px;position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;border-radius:15px;-webkit-border-radius:15px;}
.lead .container .inner h1 {color:#333;text-align: center; font-weight: bold; font-size: 21px;position: absolute;z-index: 9;left:50%;margin-top: -50px;}
.lead .container .inner h1::before {content: ''; position: absolute;top: -5px; left: 10%; height:50px;width: 8px; transform: rotate(-15deg);background-position: center; background-size: cover; background-repeat: no-repeat;}
.lead .container .inner h1::after {content: ''; position: absolute;top: -5px; right:10%; height:50px;width: 8px; transform: rotate(15deg);background-position: center; background-size: cover; background-repeat: no-repeat;}
.lead.spot {background-color: rgba(29,172,224,0.1);background-image:radial-gradient(rgba(29,172,224,0.2) 1px, transparent 1px);background-size: 10px 10px;}
.lead.spot .container .inner h1 {width: 830px;margin-left: -415px;}
.lead.spot .container .inner h1::before {background-image: url(../images/spot/deco.png);}
.lead.spot .container .inner h1::after {background-image: url(../images/spot/deco.png);}
.lead.seminar {background-color: rgba(175,89,212,0.1);background-image:radial-gradient(rgba(175,89,212,0.2) 1px, transparent 1px);background-size: 10px 10px;}
.lead.seminar .container .inner h1 {width: 450px;margin-left: -225px;}
.lead.seminar .container .inner h1::before {background-image: url(../images/seminar/deco.png);}
.lead.seminar .container .inner h1::after {background-image: url(../images/seminar/deco.png);}
.lead.holiday {background-color: rgba(239,88,76,0.1);background-image:radial-gradient(rgba(239,88,76,0.2) 1px, transparent 1px);background-size: 10px 10px;}
.lead.holiday .container .inner h1 {width:800px;margin-left: -400px;}
.lead.holiday .container .inner h1::before {background-image: url(../images/holiday/deco.png);}
.lead.holiday .container .inner h1::after {background-image: url(../images/holiday/deco.png);}
@media screen and (max-width: 1350px) {
    .lead .container figure {width: 20%;}
    .lead .container {padding-right:15%;position:relative;display: block;}
}
@media screen and (max-width: 767px) {
    .lead {padding:20px;}
    .lead .container {padding:0px;margin: 0;min-width:auto;}
    .lead .container figure {top: -75px;-;width:100px;height: 148px;right: 20px;}
    .lead.seminar .container figure {top: -90px;-;width:100px;height: 148px;right: 20px}
    .lead .container .inner h1 {padding-right: 90px;margin-bottom: 10px;color:#333;text-align: left; font-weight: bold; font-size:15px;position: relative;z-index: 9;left:inherit!important;margin-top: 0px!important;margin-left: 0px!important; width: auto!important;}
    .lead .container .inner h1::before,
    .lead .container .inner h1::after {content:none;}
    
    .lead .inner,
    .lead.spot .inner,
    .lead.seminar .inner {background-color: #fff;font-size: 13px!important;line-height: 1.8em!important;padding:25px!important;border-radius:10px;-webkit-border-radius:10px;margin: 0!important;}
}
/* --------------------------
* archive
-------------------------- */
.archive {}
.archive a {color: #000;display: block;transition:all .3s ease;-webkit-transition:all .3s ease;margin-bottom: 50px;}
.archive a figure {position: relative;display: block;margin: 0 0 15px;padding: 0;line-height: 0;}
.archive a figure span {width: 80px; height: 30px; line-height: 30px; text-align: center;font-family: 'Lato', sans-serif;font-weight: 400; font-size:12px; letter-spacing: 2px;color: #fff;background-color: #EF584C; position: absolute; top: -15px; right: 15px;border-radius:2px;-webkit-border-radius: 2px;}
.archive a figure img {border-radius:5px;-webkit-border-radius: 5px;overflow: hidden;transition:all .3s ease;-webkit-transition:all .3s ease;}
.archive a:hover {color: #666;}
.archive a:hover figure img {opacity: 0.5;}
.archive a ul {margin: 0 0 15px;font-size: 0;}
.archive a ul li {margin-right: 5px;display: inline-block;font-size: 10px;line-height: 20px;padding: 0 10px;border-radius: 3px;-webkit-border-radius: 3px;}
.archive a ul li:nth-child(1) {background-color:#e4007f;color: #fff;}
.archive a ul li:nth-child(2) {background-color:#32b16c;color: #fff;}
.archive a ul li:nth-child(3) {background-color:#f19149;color: #fff;}
.archive a ul li:nth-child(4) {background-color:#1DACE0;color: #fff;}
.archive a h2 {font-size: 16px; font-weight: bold;margin-bottom: 10px;line-height: 1.8em;overflow: hidden;-o-text-overflow: ellipsis;-webkit-text-overflow: ellipsis;text-overflow: ellipsis;white-space: nowrap;}
.archive a h2 .fa {margin-right: 10px;}
.archive a h2 img {margin-right: 8px;width: 20px; height: auto; position: relative;margin-top: -3px;}

.archive a .number {padding-right: 10px;position:relative; font-size: 10px;font-family: 'Lato', sans-serif;font-weight: 400;letter-spacing: 2px; text-align: right;}
.archive a .number span {font-size: 18px;margin-left: 5px;letter-spacing: 1px;color: #AF59D4;}
.archive a .number::before {content: '';height: 1px; width: 25px;display: block;background-color:#AF59D4;position: absolute; bottom:10px;right: 35%;transform: skewY(-60deg);z-index: 9;}
.archive.holiday a .number span {font-size: 18px;margin-left: 5px;letter-spacing: 1px;color: #EF584C;}
.archive.holiday a .number::before {content: '';height: 1px; width: 25px;display: block;background-color:#EF584C;position: absolute; bottom:10px;right: 25%;transform: skewY(-60deg);z-index: 9;}

.archive a .day {font-size: 13px;}
.archive a .place {font-size: 13px;}
.archive a .text {font-size: 13px;line-height: 1.6em;height: 58px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;}
.archive a p {overflow: hidden;font-size: 12px;line-height: 1.8em;display: block;height: 38px;color: #333;padding: 0px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
@media screen and (max-width: 767px) {
    .archive {width:auto;display: block; position: relative;border: none;margin: 0 -25px;padding:25px 0 0;}
    .archive a {color: #000;padding:0px;margin: 0;margin-bottom: 25px;display: block;}
    .archive a ul li {margin-right: 3px;font-size: 10px;line-height: 20px;padding: 0 7px;border-radius: 2px;-webkit-border-radius: 2px;}
}

#holiday {display: block;padding: 0;}
#holiday ul {margin: 0;padding: 0;}
#holiday ul li {margin: 0;padding: 0;z-index: 9;width:33.3333%;height: 350px; float: left;display: block;font-size: 18px; text-align: center;transition:all .3s ease;-webkit-transition:all .3s ease;}
#holiday ul li a {margin: 0;padding: 0;z-index: 0;overflow: hidden;display: block;height: 350px; width: 100%; position: relative;background-position: center; background-size:cover; background-repeat: no-repeat;transition:all .3s ease;-webkit-transition:all .3s ease;}
#holiday ul li a::before {z-index: 9;position: absolute; top: 0;left: 0; content:''; width: 100%;height: 100%;display: block; background-color: rgba(0,0,0,0.5);transition:all .3s ease;-webkit-transition:all .3s ease;}
#holiday ul li:nth-child(1) a {background-image: url(../images/holiday/holiday_01.jpg);background-position: right center;}
#holiday ul li:nth-child(2) a {background-image: url(../images/holiday/holiday_02.jpg); }
#holiday ul li:nth-child(3) a {background-image: url(../images/holiday/holiday_03.jpg); }
#holiday ul li:nth-child(4) a {background-image: url(../images/holiday/holiday_04.jpg);background-position: right center;}
#holiday ul li:nth-child(5) a {background-image: url(../images/holiday/holiday_05.jpg); }
#holiday ul li:nth-child(6) a {background-image: url(../images/holiday/holiday_06.jpg); }
#holiday ul li a h2 {font-size: 12px; color: #fff; z-index: 19;position: relative;top: 38%;display: block; width: 100%;}
#holiday ul li a h2 span.en {display: block;text-align: center;font-family: 'Unica One', cursive; font-weight: 400;font-size:54px; line-height: 1em;letter-spacing: -2px;}
#holiday ul li a h2 span.desc { font-size: 14px;display: block;line-height: 1em;margin-bottom: 5px;color:#EF584C; font-weight: bold;}
#holiday ul li a .arrow {z-index: 19;height: 1px; width: 50%; display: block; position: absolute; left: -50%; bottom: 20%;background-color: #EF584C;transition:all .3s ease;-webkit-transition:all .3s ease;}
#holiday ul li a .arrow::before {content: '';height: 1px; width: 14px;transform: skewY(45deg);position: absolute; top: -7px; right: 0; background-color: #EF584C;}
#holiday ul li a:hover::before {background-color: rgba(0,0,0,0.8);}
#holiday ul li a:hover .arrow  {left: 0%;}
@media screen and (max-width: 767px) {
    #holiday {display: block;padding: 0;margin: 0;}
    #holiday ul li {width:50%;height: 180px;font-size: 13px;}
    #holiday ul li a {height: 180px;}
    #holiday ul li a h2 {font-size: 12px; color: #fff; z-index: 19;position: relative;top: 30%;display: block; width: 100%;}
    #holiday ul li a h2 span.en {font-size:26px; line-height: 1em;letter-spacing: -1px;}
    #holiday ul li a h2 span.desc { font-size: 12px;}
}
/* --------------------------
* post
-------------------------- */
.post {padding:0 0 50px; margin: 0;display: -webkit-flex;display: flex;}
/* mainArea */
.post .mainArea {padding: 0 25px;width: 70%;display: block;font-size: 14px;}
.post .mainArea .imgArea {margin-bottom: 50px;}
.post .mainArea .imgArea25 {margin-bottom: 25px;}
.post .mainArea h1 {font-size: 24px;font-weight: bold;margin-bottom: 25px;margin-top: 0px;line-height: 1.5em;}
.post .mainArea h1 span {font-size: 16px;display: block;color: #1DACE0;font-family: 'Lato', sans-serif;font-weight: 400; letter-spacing: 2px;}
.post .mainArea h1 img {margin-right: 10px;width: 24px; height: auto; position: relative;margin-bottom: -3px;}
.post .mainArea h2 {font-weight: bold; font-size: 18px;margin-bottom: 15px;line-height: 1.6em; border-bottom: 2px solid #1DACE0;padding-bottom: 10px;}
.post .mainArea ul.tag {margin: 0;padding: 10px 0 20px;font-size: 0;}
.post .mainArea ul.tag li {margin-right: 5px;display: inline-block;font-size: 12px;line-height: 25px;padding: 0 15px;border-radius: 3px;-webkit-border-radius: 3px;}
.post .mainArea ul.tag li.family {background-color:#e4007f;color: #fff;}
.post .mainArea ul.tag li.nature {background-color:#32b16c;color: #fff;}
.post .mainArea ul.tag li.music {background-color:#f19149;color: #fff;}
.post .mainArea ul.tag li.photo {background-color:#00a0e9;color: #fff;}
.post .mainArea ul.tag li.food {background-color:#601986;color: #fff;}
.post .mainArea ul.tag li.photo {background-color:#fff100;color: #000;}
.post .mainArea ul.tag li.sports {background-color:#81511c;color: #fff;}
.post .mainArea ul.tag li.traditional {background-color:#0068b7;color: #fff;}
.post .mainArea .cat {margin-bottom: 10px;}
.post .mainArea .cat a {text-decoration: underline;}
.post .mainArea .desc {margin-bottom: 50px;}
.post .mainArea .text {margin-bottom: 50px;padding-top: 15px;line-height: 2em;}
.post .mainArea .text > h3 {position: relative;border: 1px solid rgba(29,172,224,0.2);background-color:rgba(29,172,224,0.15);padding: 7px 0px 7px 30px;font-size: 18px; font-weight: bold;margin-bottom: 25px;display: block;border-radius: 3px;-webkit-border-radius: 3px;}
.post .mainArea .text > h3::before {content:''; position: absolute; top: 50%;margin-top: -3px; height: 6px; width: 15px; left: 0;background-color: rgba(29,172,224,0.2);}
.post .mainArea .text > span {margin-bottom: 50px;background: linear-gradient(transparent 40%, #ffff66 40%);}
.post .mainArea .text > figure {float: right;margin-left: 25px;margin-bottom: 15px; width: 45%;}
.post .mainArea .text .imgBlock {margin: 0px -10px;}
.post .mainArea .text .imgBlock li {padding: 10px;width: 33.33%;float: left;box-sizing: border-box;-webkit-box-sizing: border-box;}
.post .mainArea .text .imgBlock li figure {margin-bottom: 15px;}
.post .mainArea .text .imgBlock li h3 {font-weight: bold; text-align: center;font-size: 16px;margin-bottom: 15px;line-height: 1em;}
.post .mainArea .text .imgBlock li p {text-align: center;font-size: 13px;line-height: 1em;}
.post .mainArea .text .imgGallery {margin: 0px -10px;}
.post .mainArea .text .imgGallery li {padding: 10px 10px 10px;width: 33.33%;float: left;box-sizing: border-box;-webkit-box-sizing: border-box;}
.post .mainArea .text .btn.std {margin: 25px 0 0;padding: 0;width: 320px; text-align: center;}
.post .mainArea .text .btn.std span {font-size: 11px;}
.post .mainArea .text .lightBox {margin: 0 -10px;padding: 20px 0 50px;}
.post .mainArea .text .lightBox li {padding: 10px;width: 25%;float: left;box-sizing: border-box;-webkit-box-sizing: border-box;}
.post .mainArea .text .lightBox li figure {margin-bottom: 15px;}
.post .mainArea .text .lightBox li h3 {font-weight: bold; text-align: center;font-size: 16px;margin-bottom: 15px;line-height: 1em;}
.post .mainArea .text .lightBox li p {text-align: center;font-size: 13px;line-height: 1em;}
.post .mainArea .text dl {font-size: 14px;line-height: 1.4em;width: 100%;display: block;margin: 0;padding: 0;border-bottom: 1px dotted #ddd;}
.post .mainArea .text dl dt {font-weight: bold;text-align: right;width: 25%;margin: 0;padding: 0 40px 0 0;border-top: 1px solid #ddd!important;padding-top: 15px;display:block;float: left; box-sizing: border-box; -webkit-box-sizing: border-box;}
.post .mainArea .text dl dd {width: 75%;margin: 0;padding: 0;border-top: 1px solid #eee;padding: 15px 0;display:block;float: left;}
.post .mainArea .text dl dd:last-child {margin-bottom: 0px}
.post .mainArea .text dl dd > a {text-decoration: underline;color:#1DACE0;}
.post .mainArea .text dl dd .btn {width: 300px;}
.post .mainArea .text .caution {border:2px solid rgba(239,88,76,0.5);background-color: rgba(239,88,76,0.25);padding: 20px 35px;margin-top: 25px;border-radius:5px;-webkit-border-radius: 5px;}
.post .mainArea .text .caution h3 {font-weight: bold; font-size: 16px;color:rgba(239,88,76,1);font-size: 18px;}
.post .mainArea .text .caution ol.list {list-style-type: square!important;padding-left: 15px;}
.post .mainArea .text .caution ol.list li {line-height: 1.8em;margin-top: 10px;}
.post .mainArea .profile {border:1px solid #ddd; padding: 25px;}
.post .mainArea .profile h3 {font-weight: bold; font-size: 16px;margin-bottom: 10px; line-height: 1em;}
.post .mainArea .profile p {font-size: 12px; line-height: 1.8em;}
.post .mainArea .video {margin-bottom: 50px;}

.post .mainArea .borderBox {margin-bottom: 50px;padding: 40px 30px 30px; border: 3px solid #ddd;border-radius: 5px;-webkit-border-radius: 5px; position: relative;}
.post .mainArea .borderBox h3 {font-weight: bold; font-size: 16px; width: 200px; position: absolute; top: -20px; left: 50%;margin-left: -100px;line-height: 40px; height: 40px; background-color: #f19149; color: #fff; text-align: center;border-radius:20px;-webkit-border-radius: 20px;}
.post .mainArea .borderBox.spot h3 {background-color: #1DACE0;}
.post .mainArea .borderBox dl {font-size: 13px;line-height: 1.4em;width: 100%;display: block;margin: 0;padding: 0;border-bottom: 1px dotted #ddd;}
.post .mainArea .borderBox dl dt {font-weight: bold;text-align: right;width: 40%;margin: 0;padding: 0 40px 0 0;border-top: 1px solid #ddd!important;padding-top: 15px;display:block;float: left; box-sizing: border-box; -webkit-box-sizing: border-box;}
.post .mainArea .borderBox dl dd {width: 60%;margin: 0;padding: 0;border-top: 1px solid #eee;padding: 15px 0;display:block;float: left;}
.post .mainArea .borderBox dl dd:last-child {margin-bottom: 0px}
.post .mainArea .borderBox dl dd > a {text-decoration: underline;color:#1DACE0;}
@media screen and (max-width: 767px) {
    .post .mainArea .borderBox dl dt {font-weight: bold;text-align: left;width: 100%;margin: 0;padding: 0 40px 10px 0;border-top: 1px solid #ddd!important;padding-top: 15px;display:block;float: left; box-sizing: border-box; -webkit-box-sizing: border-box;}
    .post .mainArea .borderBox dl dd {width: 100%;margin: 0;padding: 0;border-top: 1px solid #eee;padding: 15px 0;display:block;float: left;}
}
.post .mainArea .boxLink {}
.post .mainArea .boxLink .row {margin: 0 -10px;}
.post .mainArea .boxLink .row a {margin: 10px;display: block;border: 2px solid #eee;transition:all .3s ease;-webkit-transition:all .3s ease;}
.post .mainArea .boxLink .row a img {float: left;width: 120px;margin-right: 20px;}
.post .mainArea .boxLink .row a h3 {font-size: 14px;font-weight: bold;color: #313131;margin-top: 15px;padding-right: 20px;line-height: 1em;overflow: hidden;-o-text-overflow: ellipsis;-webkit-text-overflow: ellipsis;text-overflow: ellipsis;white-space: nowrap;}
.post .mainArea .boxLink .row a p {font-size: 10px;line-height: 1.6em;color: #666;padding-right: 20px;margin-top: 5px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
.post .mainArea .boxLink .row a:hover {border: 2px solid #1DACE0;}

.post .ebook {position: relative; padding-left: 225px; height: 254px;}
.post .ebook h3 {font-size: 18px; font-weight: bold;margin-bottom: 20px;}
.post .ebook figure {position: absolute; top: 0;left: 0;width: 180px; height: auto;}
.post .ebook .btn {margin: 0 0 10px;padding: 0;}
.post .grayBg {border: 2px solid #eee;background-color: #f5f5f5;padding: 25px 30px;margin-top:35px;margin-bottom: 50px;border-radius: 10px;-webkit-border-radius: 10px;}
.post .grayBg h4 {font-weight: bold; font-size: 21px;margin-bottom: 10px; }
.post .grayBg .app { position: relative;padding-left: 145px;display: block;}
.post .grayBg .app > figure {position: absolute;top: 0;left: 0;margin-right: 20px; width: 120px;}
.post .grayBg .app p {font-size: 12px!important; line-height: 1.8em;}
.post .grayBg .app p span {display:block; border: 1px solid #000; background-color: #fff; font-size: 13px;line-height: 20px; width: 80px;margin-top: 10px;height: 20px;text-align: center;}
.post .grayBg .applink {display: block;margin-top: 25px;}
.post .grayBg .applink ul {font-size: 0; text-align: left;line-height: 1em;}
.post .grayBg .applink ul li {display:block;float: left;width: 25%;line-height: 1em;}
.post .grayBg .applink ul li:nth-child(2) {width: 30%;margin: 0 10px;}
.post .grayBg .applink ul li a {line-height: 1em;display: block;}

/* share */
.post .mainArea .share {width:100%; margin: 50px 0 0 0;border: 1px solid #ddd;padding: 20px 20px 15px; position: relative;border-radius:3px;-webkit-border-radius: 3px;}
.post .mainArea .share p {text-align: center;width: 300px;line-height: 1em; background-color: #fff;color: #333;font-size: 16px;font-weight: bold;position: absolute; top: -8px;left: 50%;margin-left: -150px;}
.post .mainArea .share ul {font-size: 0;margin: 0 -5px;line-height: 0;}
.post .mainArea .share ul li {display: inline-block;font-size:30px;width: 33.33%;padding: 5px;}
.post .mainArea .share ul li a {position: relative;box-sizing: border-box;-webkit-box-sizing: border-box;color: #fff;display: block;line-height: 50px;height: 50px;text-align: center;overflow: hidden;border-radius:3px;-webkit-border-radius: 3px;}
.post .mainArea .share ul li a::before {position: absolute;top: -100px;left: 0;width: 100%;height: 100%; background-color: rgba(255,255,255,0.25);display: block;content:'';transition:all .3s ease;-webkit-transition:all .3s ease;}
.post .mainArea .share ul li a .fa {}
.post .mainArea .share ul li a img {width: 30px; height:auto; position: relative;margin-top: -2px;}
.post .mainArea .share ul li a:hover::before{top:0px;}
.post .mainArea .share ul li:nth-of-type(1) a {background-color:#3b5998;}
.post .mainArea .share ul li:nth-of-type(2) a {background-color:#55acee;}
.post .mainArea .share ul li:nth-of-type(3) a {background-color:#00b900;}
@media screen and (max-width: 767px) {
    .post {padding:0 0 0px; margin: 0;display:block;}
    .post .mainArea .text > h3 {font-size: 14px;padding-right: 20px; line-height: 1.6em;}
    .post .mainArea .text .lightBox li p {text-align: center;font-size: 11px;line-height: 1em;}
    .post .mainArea .share {width:100%;margin-top: 25px;margin-bottom: 25px;padding: 15px 10px 5px; }
    .post .mainArea .share p {text-align: center;width: 220px;line-height: 1em; background-color: #fff;color: #333;font-size: 12px;font-weight: bold;position: absolute; top: -6px;left: 50%;margin-left: -100px;}
    .post .mainArea .text .caution {padding: 20px 20px 10px;margin-top: 20px;}
    .post .mainArea .text .caution h3 {font-weight: bold; font-size: 16px; text-align: center}
    .post .mainArea .text .caution ol.list {list-style-type: square!important;padding-left: 10px;}
    .post .mainArea .text .caution ol.list li {line-height: 1.6em;margin-top: 5px;}
    .post .mainArea .text .imgBlock li {padding: 10px;width: 100%;float: none;box-sizing: border-box;-webkit-box-sizing: border-box;}
    
    .post .mainArea .text dl {font-size: 13px;l}
    .post .mainArea .text dl dt {text-align: left;width: 100%;}
    .post .mainArea .text dl dd {width: 100%;float: none;margin-top: 10px;}
    .post .mainArea .text dl dd .btn {width: 300px;}
    
    .post .mainArea ul.news li {display: block; margin-top: 25px;line-height: 2.0em;}
    .post .mainArea ul.news li h2 {font-size: 16px; margin-bottom: 25px;padding: 10px 15px;line-height: 1.4em;}
    .post .mainArea ul.news li .inner figure {display: block;float:none;width: 100%;margin-left: 0px;margin-bottom: 20px;}
    
    .post .ebook {position: relative; padding-left: 0; height: auto;}
    .post .ebook h3 {font-size: 18px; font-weight: bold;margin-bottom: 20px;}
    .post .ebook figure {position:relative; top: inherit;left: inherit;width: 100%; height: auto;margin-bottom: 20px;}

    .post .grayBg {border: 2px solid #eee;background-color: #f5f5f5;padding: 25px 30px;margin-top:35px;margin-bottom: 50px;border-radius: 10px;-webkit-border-radius: 10px;}
    .post .grayBg h4 {font-weight: bold; font-size: 21px;margin-bottom: 10px;text-align: center;}
    .post .grayBg .app { position: relative;padding-left: 0;display: block;}
    .post .grayBg .app > figure {position: relative;top: inherit;left: inherit;margin: 0px auto 20px; width: 120px;}
    .post .grayBg .app p {font-size: 12px!important; line-height: 1.8em;}
    .post .grayBg .app p span {display:block; border: 1px solid #000; background-color: #fff; font-size: 13px;line-height: 20px; width: 80px;margin-top: 10px;height: 20px;text-align: center;}
    .post .grayBg .applink {display: block;margin-top: 25px;}
    .post .grayBg .applink ul {font-size: 0; text-align: left;line-height: 1em;}
    .post .grayBg .applink ul li {display:block;float: left;width: 30%;line-height: 1em;}
    .post .grayBg .applink ul li:nth-child(2) {width: 33%;margin: 0 10px;}
    .post .grayBg .applink ul li a {line-height: 1em;display: block;}
    
    .post .mainArea .text .imgGallery li {padding: 10px 10px 0px!important;width: 50%;float: left;box-sizing: border-box;-webkit-box-sizing: border-box;}
}

/* sidebar */
.post .sideBar {padding: 0 25px;width: 30%;display: block;}
.post .sideBar .inner {width: 100%;height:auto;display: block;margin-bottom: 50px;}
.post .sideBar .inner.fixed {position: -webkit-sticky;position: sticky; top: 100px;margin-bottom: 0;height: 616px;}
.post .sideBar .inner.fixed.large {position: -webkit-sticky;position: sticky; top: 100px;margin-bottom: 0;height: 640px;}
.post .sideBar .inner.fixed.medium {position: -webkit-sticky;position: sticky; top: 100px;margin-bottom: 0;height: 498px;}
.post .sideBar .inner h2 { position: relative;text-align: center;font-weight: bold; margin-bottom: 20px;font-size: 20px;line-height: 1em;padding-top: 25px;}
.post .sideBar .inner h2 span {text-align: center;display: block;font-family: 'Lato', sans-serif;font-weight: 400; letter-spacing: 1.5px;font-size: 10px;margin-top: 10px;color:#999;}
.post .sideBar .inner h2::after {content: '';z-index: 99;width: 100%; height: 3px;background-color: #000; position: absolute;top:0px;left: 0;background-image: url(../images/common/line.png);background-position: center; background-size:100px 10px;display: block;}
.post .sideBar .inner .catList {display: block;font-size: 0;border-left: 1px solid #ddd; border-top: 1px solid #ddd;margin-bottom: 25px;}
.post .sideBar .inner .catList li {border-bottom: 1px solid #ddd; border-right: 1px solid #ddd;width: 50%;margin: 0;padding: 0;display:inline-block;line-height: 50px;box-sizing: border-box;-webkit-box-sizing: border-box;}
.post .sideBar .inner .catList li a { font-size: 15px;font-weight: bold;color: #000;display: block;transition:all .3s ease;-webkit-transition:all .3s ease;}
.post .sideBar .inner .catList li a img {width: 24px; height: auto;margin-right: 15px;margin-left: 15px;}
.post .sideBar .inner .catList li a:hover {background-color: #f5f5f5;}
.post .sideBar .inner .postList {height: 510px;}
.post .sideBar .inner .postList ul {}
.post .sideBar .inner .postList ul li {display:block;border-bottom: 1px solid #ddd;}
.post .sideBar .inner .postList ul li:first-child {border-top: 1px solid #ddd;}
.post .sideBar .inner .postList ul li a {display: block; position: relative;height: 90px;padding: 15px 15px 15px 0;padding-left: 110px; color: #000;transition:all .3s ease;-webkit-transition:all .3s ease;}
.post .sideBar .inner .postList ul li a figure {width:90px;height: auto; position: absolute;top: 15px; left: 0;}
.post .sideBar .inner .postList ul li a figure span {width: 20px;height: 20px; position: absolute;top: -5px;left: 5px;text-align: center;line-height: 20px;font-family: 'Lato', sans-serif;font-weight: 400; font-size:12px; }
.post .sideBar .inner .postList ul li:nth-child(1) a figure span {background-color:#FFD700;color: #000;}
.post .sideBar .inner .postList ul li:nth-child(2) a figure span {background-color:#C0C0C0;color: #FFF;}
.post .sideBar .inner .postList ul li:nth-child(3) a figure span {background-color:#C47222;color: #FFF;}
.post .sideBar .inner .postList ul li:nth-child(4) a figure span {background-color:#FFF;color: #000;border: 1px solid #ccc;}
.post .sideBar .inner .postList ul li:nth-child(5) a figure span {background-color:#FFF;color: #000;border: 1px solid #ccc;}
.post .sideBar .inner .postList ul li a h3 {height: 35px;line-height: 1.4em;margin-bottom: 5px;width: 100%;overflow: hidden;}
.post .sideBar .inner .postList ul li a h3 p {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;font-size: 12px;font-weight: bold;}
.post .sideBar .inner .postList ul li a h3.title {height:auto;line-height: 1.4em;margin-bottom: 5px;width: 100%;font-weight: bold; font-size: 13px;overflow: hidden;-o-text-overflow: ellipsis;-webkit-text-overflow: ellipsis;text-overflow: ellipsis;white-space: nowrap;display: block;}
.post .sideBar .inner .postList ul li a h4 {height: 33px;line-height: 1.3em;margin-top: 2px;width: 100%;overflow: hidden;}
.post .sideBar .inner .postList ul li a h4 p {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;font-size: 12px;}
.post .sideBar .inner .postList ul li a .date {font-size: 11px;color: #444;display: block;}
.post .sideBar .inner .postList ul li a:hover {background-color: #f9f9f9;}
.post .sideBar .inner .postList .btn {margin-top: 25px;margin-bottom: 0;}
.post .sideBar .menu {}
.post .sideBar .menu ul {margin-bottom: 25px;}
.post .sideBar .menu ul li {margin-top:7px;}
.post .sideBar .menu ul li:first-child{margin-top: 0;}
.post .sideBar .menu ul li a {display: block;border: 1px solid #ddd;padding: 0px 0px 0px 110px;height:62px;position: relative;color: #000;transition:all .3s ease;-webkit-transition:all .3s ease;}
.post .sideBar .menu ul li a figure {position: absolute; top: 0px; left: 0px; width: 90px;height:60px;height: auto;}
.post .sideBar .menu ul li a p {color: #AF59D4;font-size: 10px;font-family: 'Lato', sans-serif;font-weight: 400; letter-spacing: 1px;line-height: 1em;margin-top: 10px;}
.post .sideBar .menu ul li a p span {margin-right: 5px;}
.post .sideBar .menu ul li a h3 {font-size: 14px; font-weight: bold;line-height: 1em;margin-top: 7px;}
.post .sideBar .menu ul li a:hover {border: 1px solid #AF59D4;}
.post .sideBar .menu.holiday ul li a p {color:#EF584C;}
.post .sideBar .menu.holiday ul li a:hover {border: 1px solid #EF584C;}

@media screen and (max-width: 767px) {
    .post .mainArea .imgArea {margin: 0 -20px 30px;}
    .post .mainArea .text figure {float:none;margin:0; width: 100%;margin-bottom: 25px;}
    .post .mainArea h1 {font-size: 21px;}
    .post .mainArea h2 {font-size: 16px;}
    .post .mainArea .text {margin-bottom: 25px;}

    .post .mainArea dl {font-size: 14px;line-height: 1.4em;width: 100%;display: block;margin: 0;padding: 0;border-bottom: 1px dotted #ddd;}
    .post .mainArea dl dt {font-weight: bold;text-align: left;width: 100%;margin: 0;padding: 0 40px 0 0;border-top: 1px solid #ddd!important;padding-top: 15px;display:block;float: left; box-sizing: border-box; -webkit-box-sizing: border-box;}
    .post .mainArea dl dd {width: 100%;margin: 0;padding: 0;border-top:none;padding: 10px 0;display:block;float: left;}
    .post .mainArea dl dd:last-child {margin-bottom: 0px}
    .post .mainArea dl dd > a {text-decoration: underline;color:#1DACE0;}

    .post {padding:0px; margin: 0px;display:block;}
    .post .mainArea {padding: 0px;width: 100%;display: block;font-size: 13px;}
    .post .sideBar {padding: 0px;width: 100%;display: block;padding-top: 25px;}
    .post .sideBar .inner {margin-bottom:25px;height:auto!important;}
    .post .sideBar .inner.fixed,
    .post .sideBar .inner.fixed.medium,
    .post .sideBar .inner.fixed.large {position:relative; top:inherit;margin-bottom: 0;height:auto!important;padding-bottom: 0!important;}
    .post .sideBar .inner .postList {height:auto;}
}

/* --------------------------
* single
-------------------------- */
.single {width:1000px; margin: 0 auto 75px;display: block;}
.single { text-align: center;}
.single .table {margin-bottom: 50px;}
.single h2 {text-align: center;font-size: 21px; font-weight: bold;margin-bottom: 25px;position: relative;display: inline-block;padding: 0 50px;}
.single h2::before,
.single h2::after {content: '';position: absolute;top: 50%;display: inline-block;width: 30px;height: 1px;background-color: black;}
.single h2::before {left:0;}
.single h2::after {right: 0;}
.single h3 {font-size: 21px;font-weight: bold;margin-bottom: 25px; text-align: left;margin-left: 25px;}
.single h3 .fa {color: #1DACE0;margin-right: 15px;}
.single h3 span {font-size: 10px;color: #1DACE0;margin-left: 15px;letter-spacing: 1px;font-family: 'Lato', sans-serif;font-weight: 400;}
.single .block {margin-bottom: 100px;}
.single .block.center {text-align: center; font-size: 16px;}
.single .borderBox {position: relative;width: 800px;margin: 0 auto; padding: 25px;border: 2px solid #1DACE0; text-align: left;}
.single .borderBox figure {width: 40%;float: left; margin-right: 30px;}
.single .borderBox .btn {position: absolute;bottom:25px; right:25px;}
.single .linkBox {margin-bottom: 50px;}
.single .linkBox ul {}
.single .linkBox ul li {display:block;margin-top: 2px;}
.single .linkBox ul li:first-child {margin-top: 0;}
.single .linkBox ul li a {color: #000;padding: 20px 25px; background-color: #f5f5f5;display: block;font-size: 16px;text-align: left;transition:all .3s ease;-webkit-transition:all .3s ease;}
.single .linkBox ul li a span {color: #ccc;font-size: 11px;margin-left: 10px;font-family: 'Lato', sans-serif;font-weight: 400;letter-spacing: 1px;}
.single .linkBox ul li a .fa {margin-right:15px;color: #1DACE0;}
.single .linkBox ul li a:hover {background-color: #f9f9f9;}
.single ul.news {margin: 0;padding: 0;text-align: left; }
.single ul.news li {display: block; margin-top: 50px;line-height: 2.2em;}
.single ul.news li:before,
.single ul.news li:after {content:"";display:table;}
.single ul.news li:after {clear:both;}
.single ul.news li:first-child {margin-top: 0;}
.single ul.news li > h2 { text-align: left;width:100%; border: 1px solid #eee;font-size: 18px; font-weight: bold;margin-bottom: 35px;background-color: #f5f5f5;padding: 15px 20px;line-height: 1.6em;border-radius:3px;-webkit-border-radius: 3px;}
.single ul.news li > h2::before,
.single ul.news li > h2::after {content:none;}
.single ul.news li .inner {padding: 0;margin-bottom: 10px;}
.single ul.news li .inner .text {margin: 0;padding: 0; text-align:left;}
.single ul.news li .inner figure {display: block;float:right; width: 40%;margin-left: 25px;margin-bottom: 10px;}
.single ul.news li p {display: block; width: 100%;color: #1DACE0;font-size: 10px;font-family: 'Lato', sans-serif;font-weight: 400; letter-spacing: 2px; font-size:11px;text-align:right;}
@media screen and (max-width: 767px) {
    .single {width:auto; margin: 0 auto 0px;display: block;}
    .single ul.news li {display: block; margin-top: 25px;line-height: 2.0em;}
    .single ul.news li > h2 {font-size: 14px; margin-bottom: 25px;padding: 10px 15px;line-height: 1.4em;}
    .single ul.news li > h2::before,
    .single ul.news li > h2::after {content:none;}
    .single ul.news li .inner figure {display: block;float:none;width: 100%;margin-left: 0px;margin-bottom: 20px;}
    .single h2 {font-size: 14px; }
    .single .linkBox {margin-bottom: 25px;}
    .single .linkBox ul li a {color: #000;padding: 10px 20px; background-color: #f5f5f5;display: block;font-size: 14px;}
    .single .linkBox ul li a span {font-size: 10px;display: block;}
    .single .borderBox {position: relative;width: auto!important;margin: 0 auto 25px; padding:15px;border: 2px solid #1DACE0; text-align: left;}
    .single .block {margin-bottom: 35px;}
    .single .block.center { text-align: left; font-size: 14px;}
    .single .block.center br {display:none;}
    .single .borderBox {position: relative;width: auto;margin: 0 auto; padding: 20px;border: 2px solid #1DACE0; text-align: left;}
    .single .borderBox figure {width: 100%;float: none; margin-right: 0px;margin-bottom: 25px;}
    .single .borderBox .btn {position: relative;bottom:inherit; right:inherit;margin: 20px auto 0;padding: 0;}
}

.sitemap {}
.sitemap h2 {line-height: 50px; font-size: 16px; font-weight:bold;border-bottom:1px solid #FFF;}
.sitemap h2 a {color: #000;position: relative;display: block;padding-left: 20px;background-color:rgba(29,172,224,0.25);transition:all .3s ease;-webkit-transition:all .3s ease;}
.sitemap h2 a > .fa { position: absolute; top: 50%;margin-top: -12px; right:20px;color: #1DACE0; font-size: 24px;}
.sitemap h2 a:hover {background-color:rgba(29,172,224,0.5);;}
.sitemap ul {margin: 0 0 50px;padding: 0;font-size: 0;}
.sitemap ul li {border-bottom: 1px solid #eee;line-height:50px;font-size: 14px;display: inline-block; width: 50%;}
.sitemap ul li a {color: #000;padding-left: 20px;transition:all .3s ease;-webkit-transition:all .3s ease;display: block;}
.sitemap ul li a > .fa {margin-right: 15px;color: #1DACE0;}
.sitemap ul li a:hover {background-color: rgba(29,172,224,0.1);}
@media screen and (max-width: 767px) {
    .sitemap ul li {line-height:40px;font-size: 14px;display: block; width: 100%!important;}
}
/* --------------------------
* calender
-------------------------- */
.monthNav {display: block;background-color:rgba(29,172,224,0.25);padding-top: 20px;border-bottom: 1px solid rgba(29,172,224,0.5);background-color: rgba(29,172,224,0.1);background-image:radial-gradient(rgba(29,172,224,0.2) 1px, transparent 1px);background-size: 10px 10px;}
.monthNav ul {text-align: center; font-size: 0;}
.monthNav ul li {display: inline-block;height: 50px;font-size: 15px;margin: 0 5px;background-color: #fff;}
.monthNav ul li a {background-color:rgba(29,172,224,0.9);line-height: 54px;height: 50px;color: #FFF;display: block;padding: 0 25px;border-top-left-radius:5px;border-top-right-radius:5px;-webkit-border-top-left-radius:5px;-webkit-border-top-right-radius:5px;transition:all .3s ease;-webkit-transition:all .3s ease;}
.monthNav ul li a:hover {background-color:rgba(29,172,224,0.5);color: #fff;}
@media screen and (max-width: 767px) {
    .monthNav {padding: 20px;}
    .monthNav ul {border:none;}
    .monthNav ul li {width:33.33%;font-size: 14px;padding: 3px;height: 30px;margin: 0;background-color:transparent;}
    .monthNav ul li a {border:none;border-bottom: none;display: block;background-color: #1DACE0; color: #fff;line-height: 30px;height: 30px;border-radius: 0;-webkit-border-radius:0;}
}


.cal {padding-bottom: 25px;padding-top: 0px;}
.cal h1 {display: block;height: 50px;line-height: 50px;position: relative;text-align: center; font-size: 30px;font-weight: bold;margin: 0 25px 25px;}
.cal h1 span {background-color: #fff; padding: 0 30px;line-height: 50px;display:inline-block; position: relative;z-index: 2;}
.cal h1::before { content: '';opacity: 0.5;position: absolute; top: 50%;left: 0;width: 100%;height:8px;margin-top: -4px;z-index: 0;background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #1DACE0), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #1DACE0),color-stop(.75, #1DACE0), color-stop(.75, transparent),to(transparent));-webkit-background-size: 5px 5px;}
.cal .block {border: 1px solid #ccc;padding:30px;margin-bottom: 25px;}
.cal .block figure {float: right; padding-left: 25px; width: 30%;}
.cal .block h2 {font-weight: bold; font-size: 18px;color: #1DACE0;margin-bottom: 15px;}
.cal .block h2 .fa {margin-right: 10px;}
.cal .block h3 {font-size: 13px;line-height: 1.8em;margin-bottom: 20px;}
.cal .block p {margin-top: 5px;font-size: 13px;}
.cal ul.tag {margin: 0;padding: 10px 0;font-size: 0;}
.cal ul.tag li {margin-right: 5px;display: inline-block;font-size: 11px;line-height: 20px;padding: 0 10px;border-radius: 3px;-webkit-border-radius: 3px;}
.cal ul.tag li.family {background-color:#e4007f;color: #fff;}
.cal ul.tag li.nature {background-color:#32b16c;color: #fff;}
.cal ul.tag li.music {background-color:#f19149;color: #fff;}
.cal ul.tag li.photo {background-color:#00a0e9;color: #fff;}
.cal ul.tag li.food {background-color:#601986;color: #fff;}
.cal ul.tag li.photo {background-color:#fff100;color: #000;}
.cal ul.tag li.sports {background-color:#81511c;color: #fff;}
.cal ul.tag li.traditional {background-color:#0068b7;color: #fff;}
@media screen and (max-width: 767px) {
    .cal {padding-bottom: 0px;padding-top: 25px;}
    .cal h1 {display: block;height: 50px;line-height: 50px;position: relative;text-align: center; font-size: 24px;font-weight: bold;margin: 0 0px 25px;}
    .cal .block {border: 1px solid #ccc;padding:20px;margin-bottom: 20px;}
    .cal .block figure {float:none; padding-left: 0px; width: 100%;margin-bottom: 25px;}
    .cal .block h2 {font-weight: bold; font-size: 18px;color: #1DACE0;margin-bottom: 15px;}
}

/* --------------------------
* refine
-------------------------- */
.refine {padding:50px 100px 50px;background-color: rgba(29,172,224,0.1);background-image:radial-gradient(rgba(29,172,224,0.2) 1px, transparent 1px);background-size: 10px 10px;}
.refine .inner {margin: 0 auto;max-width: 1600px;}
.refine .inner {display: block;}
.refine .inner .row {margin: 0 -10px;}
.refine .inner .block { width: 50%;height: auto;padding: 0 10px; float: left;display: block;}
.refine .inner .block h2 {color: #000;text-align: center;font-weight: bold; font-size: 21px;position: relative;z-index: 9;margin-bottom: 20px;}
.refine .inner .block h2 span {background-color: #FFF;display: block; width: 220px; margin: 0 auto;}
.refine .inner .block .cat {margin: 0;padding: 20px 10px 10px 10px; position: relative;background-color: #fff;border: 2px solid #1DACE0;border-radius: 5px;-webkit-border-radius: 5px;}
.refine .inner .block .cat ul {margin: 0;padding: 0;font-size: 0;}
.refine .inner .block .cat ul li {width:33.33%;display:inline-block;height: 140px;}
.refine .inner .block .cat ul li a {position: relative;color: #fff;height: 138px;padding: 20px 0 0;margin: 1px;background-color:#1DACE0;display: block;font-size: 16px; text-align: center; font-weight: bold;transition:all .3s ease;-webkit-transition:all .3s ease;}
.refine .inner .block .cat ul li a span {text-align: center; line-height: 20px;width: 20px;height: 20px;font-size: 12px;background-color: #FFF;color: #1DACE0;display:inline-block;position: absolute; top: 10px;right: 10px; font-weight: normal;border-radius: 10px;-webkit-border-radius: 10px;font-family: 'Lato', sans-serif;font-weight: 400;}
.refine .inner .block .cat ul li a img {width: 60px; height: auto;display:block;margin:0 auto 10px;}
.refine .inner .block .cat ul li a:hover {opacity: 0.7;}
.refine .inner .block .areaMap {margin: 0;padding: 20px 10px 10px 10px; position: relative;background-color: #fff;border: 2px solid #1DACE0;border-radius: 5px;-webkit-border-radius: 5px;}
.refine .inner .block .areaMap .bgColor {background-color: #F2F0E7;height: 280px; position: relative; background-image: url(../images/spot/map.png); background-position: center; background-size: cover; background-repeat:  no-repeat; }
.refine .inner .block .areaMap .bgColor ul {position: relative; width: 100%; height: 100%;display: block;}
.refine .inner .block .areaMap .bgColor ul li {display: block; position: absolute;}
.refine .inner .block .areaMap .bgColor ul li:nth-child(1) {bottom: 40%; left: 5%;}
.refine .inner .block .areaMap .bgColor ul li:nth-child(2) {bottom: 12%; right: 25%;}
.refine .inner .block .areaMap .bgColor ul li:nth-child(3) {top: 40%; right: 5%;}
.refine .inner .block .areaMap .bgColor ul li:nth-child(4) {top: 10%; left: 35%}
.refine .inner .block .areaMap .bgColor ul li a { position: relative;transition:all .3s ease;-webkit-transition:all .3s ease;font-size: 16px;color: #000;font-weight: bold;width: 160px;height: 40px;line-height: 36px; text-align: center;border:2px solid #1DACE0;display: block;background-color: #fff;border-radius: 20px;-webkit-border-radius: 20px; }
.refine .inner .block .areaMap .bgColor ul li a span {text-align: center; line-height: 20px;width: 20px;height: 20px;font-size: 12px;background-color: #1DACE0;color: #fff;display:inline-block;position: relative; font-weight: normal;border-radius: 10px;-webkit-border-radius: 10px; position: absolute;top: -10px; left: 15px;font-family: 'Lato', sans-serif;font-weight: 400;}
.refine .inner .block .areaMap .bgColor ul li a .fa {color: #1DACE0; font-size: 20px; position: absolute; top: 50%; line-height: 1em; right: 15px;margin-top: -11px;}
.refine .inner .block .areaMap .bgColor ul li a:hover {background-color: #1DACE0; color: #fff;}
.refine .inner .block .areaMap .bgColor ul li a:hover .fa {color: #fff;}
.refine .inner .block .areaMap .bgColor p {display: block; position: absolute; font-size: 12px; color: #000; font-weight: bold;line-height: 1em;}
.refine .inner .block .areaMap .bgColor .yoshida {top: 10px;left: 10px;}
.refine .inner .block .areaMap .bgColor .gotenba { bottom: 10px;left: 40%;}
.refine .inner .block .areaMap .bgColor .doshi { top: 10px; right:60px;}
@media screen and (max-width: 767px) {
    .refine {padding: 20px 20px 20px;margin: 0 0 -20px;}
    .refine .inner {margin: 0px;padding: 0;display: block;}
    .refine .inner .block { width: 100%;height: auto;margin: 0px 0 20px;padding: 0px; float: none;display: block;}
    .refine .inner .block h2 {font-size: 16px;margin-bottom: 10px;}
    .refine .inner .block .cat {margin: 0;padding: 10px 10px 10px 10px;}
    .refine .inner .block .cat ul li {height: 87px;}
    .refine .inner .block .cat ul li a {color: #fff;height: 85px;padding: 10px 0 0;margin: 1px;background-color:#1DACE0;display: block;font-size: 12px;}
    .refine .inner .block .cat ul li a img {width: 35px; height: auto;display:block;margin:0 auto 5px;}
    .refine .inner .block .areaMap {margin: 0;padding: 10px 10px 10px 10px;}
    .refine .inner .block .areaMap .bgColor {height: 200px;}
    .refine .inner .block .areaMap .bgColor ul li a {font-size: 13px;width: 100px;}
    .refine .inner .block .areaMap .bgColor ul li a .fa {display: none;}
    .refine .inner .block .areaMap .bgColor ul li a:hover {background-color: #1DACE0; color: #fff;}
}

/* --------------------------
* sitemap
-------------------------- */
.sitemap {}
.sitemap h2 {line-height: 50px; font-size: 16px; font-weight:bold;border-bottom:1px solid #FFF;}
.sitemap h2 a {color: #000;position: relative;display: block;padding-left: 20px;background-color:rgba(29,172,224,0.25);transition:all .3s ease;-webkit-transition:all .3s ease;}
.sitemap h2 a > .fa { position: absolute; top: 50%;margin-top: -12px; right:20px;color: #1DACE0; font-size: 24px;}
.sitemap h2 a:hover {background-color:rgba(29,172,224,0.5);;}
.sitemap ul {margin: 0 0 50px;padding: 0;font-size: 0;}
.sitemap ul li {border-bottom: 1px solid #eee;line-height:50px;font-size: 14px;display: inline-block; width: 50%;}
.sitemap ul li a {color: #000;padding-left: 20px;transition:all .3s ease;-webkit-transition:all .3s ease;display: block;}
.sitemap ul li a > .fa {margin-right: 15px;color: #1DACE0;}
.sitemap ul li a:hover {background-color: rgba(29,172,224,0.1);}

/* --------------------------
* zekkei
-------------------------- */
.livecam ul {}
.livecam ul li {width: 50%; float: left;padding: 30px;}
.livecam ul li:nth-child(1) {background-color:#00a2e6;border-top-left-radius:10px;border-bottom-left-radius:10px; }
.livecam ul li:nth-child(2) {background-color:#e86ba2;border-top-right-radius:10px;border-bottom-right-radius:10px;}
.livecam ul li h2 {text-align: right; font-weight: bold; font-size: 28px;margin-bottom: 20px;color: #fff; position: relative;}
.livecam ul li h2 span {font-family: 'Lato', sans-serif;font-weight: 400; font-size: 14px; display: block; line-height: 1em;margin-top: 15px; letter-spacing: 1px;}
.livecam ul li h2 img {width: 100px; height: auto; position: absolute;top: -5px; left: -10px;}
.livecam ul li .note {text-align: center;color: #fff; font-size: 14px;margin-bottom: 10px;margin-top: 10px;}
.livecam ul li .note a {color: #fff; text-decoration: underline;}
.livecam ul li .note .fa { color: #ffef00;margin-right: 5px;}
.livecam ul li .btn.std {background-color: #fff;}
.livecam ul li .btn.std a span {font-size: 16px!important;}
@media screen and (max-width: 767px) {
    .livecam {margin-bottom: 20px;margin-top: 20px;}
    .livecam ul li {width: 100%; float: none;padding: 20px;display: block;}
    .livecam ul li:nth-child(1) {background-color:#00a2e6;border-top-left-radius:10px;border-bottom-left-radius:0px;border-top-right-radius:10px;}
    .livecam ul li:nth-child(2) {background-color:#e86ba2;border-top-right-radius:0px;border-bottom-right-radius:10px;border-bottom-left-radius:10px;}
    .livecam ul li h2 {font-size: 21px;margin-bottom: 5px;}
    .livecam ul li h2 img {width: 75px; }
}

.blogParts {margin-top: 40px;margin-bottom: 40px;}
.blogParts .accordion {}
.blogParts .accordion dl {}
.blogParts .accordion dl dt { position: relative;border: 1px solid #ddd; display: block; line-height: 50px; text-align:center;font-size: 16px; background-color: #eee;transition:all .3s ease;-webkit-transition:all .3s ease;cursor: pointer;}
.blogParts .accordion dl dt:hover,
.blogParts .accordion dl dt.open{ background-color: #ddd;}
.blogParts .accordion dl dt .plus {width: 20px; height: 20px;position: absolute; top: 15px; right:20px;transition:all .5s ease;-webkit-transition:all .5s ease;}
.blogParts .accordion dl dt .plus span {height:1px; width: 100%; background-color: #000;display: block; position: absolute;}
.blogParts .accordion dl dt .plus span:nth-of-type(1) {top: 10px;}
.blogParts .accordion dl dt .plus span:nth-of-type(2) {top: 10px;transform: rotate(90deg);}
.blogParts .accordion dl dt.open .plus {transform: rotate(45deg);}
.blogParts .accordion dl dd h3 {font-weight: bold; font-size: 16px;margin-bottom: 10px;}
.blogParts .accordion dl dd textarea {width:100%;margin-bottom: 20px;}
.blogParts .accordion dl dd {display: none;background-color:#f5f5f5;margin: 0;padding: 50px 50px 20px;border: 1px solid #ddd;}
@media screen and (max-width: 767px) {
    .blogParts {display: none;}
}
/* sponsor */
#adArea {padding: 10px 100px 25px;background-color:#5fc2e6;}
#adArea .inner {max-width: 1600px; margin: 0 auto;}
#adArea h1 {height: 50px;line-height: 50px;z-index: 0;position: relative;color: #FFF;font-family: 'Lato', sans-serif;font-weight: 400;letter-spacing: 1px;text-align: center;display: block;font-size: 11px;margin-bottom: 10px;}
#adArea h1 span {height: 50px;line-height: 50px;background-color: #5fc2e6;display: block;z-index: 9;position: absolute; top: 0; left: 50%;width: 100px; text-align: center;margin-left: -50px;}
#adArea h1::before{z-index: 0;content:''; height: 1px;width: 100%; position: absolute; top: 50%;left: 0; background-color: #FFF;}
#adArea ul {text-align: left;font-size: 0;margin: 0 -10px;}
#adArea ul li {width: 20%;height: auto; display: inline-block;}
#adArea ul li a figure {padding: 0 10px;}
#adArea ul li a {}
#adArea ul li a:hover {}
@media screen and (max-width: 767px) {
    #adArea h1 {height: 40px;line-height: 40px;margin-bottom: 0px;}
    #adArea h1 span {height: 40px;line-height: 40px;}
    #adArea {padding: 5px 25px 20px;background-color:#5fc2e6;margin-top: 0px;position: relative;}
    #adArea ul li {width: 50%;height: auto; display: inline-block;}
    #adArea ul li a figure {padding: 5px;}
}

.zekkei {}
.zekkei .mainCam {position: relative;margin-bottom: 0px;}
.zekkei .mainCam .time {padding-top: 14px;font-size: 12px;position: absolute; top: 25px;right: 25px;background-color:#fff45c;display: block; height: 100px; width: 100px; text-align: center;overflow: hidden;border-radius:50px;-webkit-border-radius:50px;}
.zekkei .mainCam .time span {display: block;line-height: 0.9em;font-size: 30px;font-family: 'Lato', sans-serif;font-weight: 400;}
.zekkei .mainCam .cara {width: 120px;position: absolute; bottom: -25px;left: 10px;}
.zekkei .mainCam .camstat {position: absolute; bottom: 15px;left:155px;line-height: 20px; width: 230px;border: 1px solid #fff;color: #fff; text-align: center;font-family: 'Lato', sans-serif;font-weight: 400;font-size: 12px;}
.zekkei .mainCam .switch {position: absolute;bottom: 50px; left:150px;}
.zekkei .mainCam .switch ul {font-size: 0; text-align: center;}
.zekkei .mainCam .switch ul li {font-size: 14px; display: inline-block;width:120px; }
.zekkei .mainCam .switch ul li a {display: block;padding:0 5px;}
.zekkei .mainCam .switch ul li a.active {position: relative;}
.zekkei .mainCam .switch ul li a img {border: 5px solid transparent;transition:all .5s ease;-webkit-transition:all .5s ease;}
.zekkei .mainCam .switch ul li a.active img {border: 5px solid #1DACE0;}
.zekkei .mainCam .switch ul li a p {font-size:13px;color: #FFF;margin-bottom: 5px;line-height: 1em;}
.zekkei .mainCam .switch ul li a:hover img {border: 5px solid #1DACE0;}
.zekkei .place {line-height: 40px;margin-bottom: 10px;text-align: center;background-color:#fff45c;}
.zekkei .place a {color: #1DACE0; text-decoration: underline;}
.zekkei .block {display: block;margin-bottom: 25px;}
.zekkei .block h2 { position:relative; display: block;font-size: 12px; text-align: center;font-family: 'Lato', sans-serif;font-weight: 400;color: #1DACE0;margin-bottom: 20px;}
.zekkei .block h2 span {background-color: #fff;position: relative;z-index: 1;padding: 0 20px; letter-spacing: 1px;}
.zekkei .block h2::before {content: '';height: 1px; width: 100%; position: absolute; top: 50%; left: 0;display: block;background-color: #1DACE0;z-index: 0;}
.zekkei .block .banner {}
.zekkei .block .banner ul {}
.zekkei .block .banner ul:before,.zekkei .block .banner ul:after {content:"";display:table;}.zekkei .block .banner ul:after {clear:both;}.zekkei .block .banner ul {zoom:1;}
.zekkei .block .banner ul li {margin-top: 10px;}
.zekkei .block .banner ul li:first-child {margin-top: 0px;}
.zekkei .block .banner ul li a {}
.zekkei .block .banner ul li a:hover {}
@media screen and (max-width: 767px) {
    .zekkei .place {line-height: 30px;margin-bottom: 25px;font-size: 10px;}
    .zekkei .mainCam {position: relative;margin-bottom: 0px;padding-bottom: 105px;}
    .zekkei .mainCam.chan {padding-bottom: 20px;}
    .zekkei .mainCam > figure {margin: 0 -25px;}
    .zekkei .mainCam .time {padding-top: 5px;font-size: 10px;position: absolute; top: -20px;right: 10px;background-color:#fff45c;display: block; height: 60px; width: 60px; text-align: center;overflow: hidden;border-radius:30px;-webkit-border-radius:30px;}
    .zekkei .mainCam .time span {display: block;line-height: 0.5em;font-size:18px;font-family: 'Lato', sans-serif;font-weight: 400;}
    .zekkei .mainCam .cara {width: 50px;position: absolute; top: -25px;left:5px;}
    .zekkei .mainCam .camstat {position: absolute;top: -25px;left:0px;line-height: 20px; width: 100%;border:none;color: #000; text-align: left;padding-left: 70px;font-family: 'Lato', sans-serif;font-weight: 400;font-size: 11px;letter-spacing: 1px;}
    
    .zekkei .mainCam .switch {position: absolute;bottom: -2px; left:50%; width: 200px;margin-left: -100px;z-index: 99;}
    .zekkei .mainCam .switch ul li {font-size: 14px; display: inline-block;width:100px; }
    .zekkei .mainCam .switch ul li a p {font-size:11px;color: #000;margin-top: 5px;margin-bottom: 0;line-height: 1em;}
    .zekkei .mainCam .switch ul li a img {border: 3px solid transparent;}
    .zekkei .mainCam .switch ul li a.active img,
    .zekkei .mainCam .switch ul li a:hover img {border: 3px solid #1DACE0;}
    .zekkei .mainCam .switch ul li a.active::before{content: "";position: absolute;top: -20px;left: 50%;margin-left: -10px;border: 10px solid transparent;border-bottom: 10px solid #1DACE0;}
    
    .zekkei .block .banner ul { margin: 0 -5px;}
    .zekkei .block .banner ul li {margin-top: 0px;width: 50%; float: left;padding:5px;}
    .zekkei .block .banner ul li:first-child {margin-top: 0px;}
}

.zekkei24 {padding: 0 15px 50px!important;}
.zekkei24 a {display: block;padding: 10px;text-align: center;transition:all .3s ease;-webkit-transition:all .3s ease;}
.zekkei24 a.yesterday figure {border:5px solid #1DACE0;}
.zekkei24 a p {color: #333;margin-top: 10px;margin-bottom: 0;}
.zekkei24 a p .fa {color: #1DACE0;margin-right:10px;}
.zekkei24 a:hover {background-color: #f5f5f5;}
@media screen and (max-width: 767px) {
    .zekkei24 {padding: 0 0px 25px!important;margin: 0 -10px!important;}
    .zekkei24 a {padding-bottom: 0px;}
    .zekkei24 a p {color: #333;margin-top: 5px;margin-bottom: 0;}
}
.zekkei365 {}
.zekkei365 .cal {min-width: 1000px;}
.zekkei365 .cal > ul {font-size: 0;margin: 0 20px 50px;padding: 0;}
.zekkei365 .cal > ul > li {width:13.28%;margin: 0.5%;display: inline-block;font-size: 14px; text-align: center;position: relative;padding-bottom: 50px;}
.zekkei365 .cal > ul > li.week {background-color:#1DACE0; color: #fff;line-height: 30px;font-family: 'Lato', sans-serif;font-weight: 400;padding-bottom: 0;}
.zekkei365 .cal > ul > li.imgBox {}
.zekkei365 .cal > ul > li.imgBox.non {background-color: #f5f5f5;}
.zekkei365 .cal > ul > li.imgBox img {width: 100%; height: auto;}
.zekkei365 .cal > ul > li.imgBox .fa {}
.zekkei365 .cal > ul > li > ul {text-align: left; position: absolute;bottom: 7px;left: 10px;}
.zekkei365 .cal > ul > li > ul > li {display:inline-block;}
.zekkei365 .cal > ul > li > ul > li a {color: #999;padding: 5px 3px;font-size:15px;transition:all .5s ease;-webkit-transition:all .5s ease;}
.zekkei365 .cal > ul > li > ul > li a:hover {color: #1DACE0;}
.zekkei365 .cal > ul > li span { position: absolute;bottom: 10px;right: 10px;font-family: 'Lato', sans-serif;font-weight: 400; font-size: 26px;color: #333;}
.zekkei365 p {line-height: 50px; text-align: center;}

.historyNav {width: 700px;margin: 50px auto;}
.historyNav ul {width: 350px;display:block;float: left;font-size: 0;margin: 0;padding: 0 25px; text-align: center;}
.historyNav ul li {display:inline-block;font-size:24px;line-height: 38px;color: #FFF; }
.historyNav ul li:nth-child(1) {width: 40px;height: 40px;background-color: #eee;border-radius:20px;-webkit-border-radius: 20px; text-align: left;}
.historyNav ul li:nth-child(2) {width: 200px;color: #333; letter-spacing: 1px;font-size: 24px;}
.historyNav ul li:nth-child(3) {width: 40px;height: 40px;background-color: #eee;border-radius:20px;-webkit-border-radius: 20px; text-align: right;}
.historyNav ul li:nth-child(1) .fa {margin-left: 14px;}
.historyNav ul li:nth-child(3) .fa {margin-right: 14px;}
.historyNav ul li a {display: block;color: #FFF;width: 40px;height: 40px;background-color: #1DACE0;border-radius:20px;-webkit-border-radius: 20px;}

.zekkeiNav.top {display: block;background-color:rgba(29,172,224,0.25);padding-top: 20px;border-bottom: 1px solid rgba(29,172,224,0.5);background-color: rgba(29,172,224,0.1);background-image:radial-gradient(rgba(29,172,224,0.2) 1px, transparent 1px);background-size: 10px 10px;}
.zekkeiNav.top ul {text-align: center; font-size: 0;}
.zekkeiNav.top ul li {display: inline-block;height: 50px;font-size: 15px;margin: 0 5px;background-color: #fff;}
.zekkeiNav.top ul li a {line-height: 54px;height: 50px;color: #1789C9;display: block;padding: 0 25px;border-top-left-radius:5px;border-top-right-radius:5px;-webkit-border-top-left-radius:5px;-webkit-border-top-right-radius:5px;transition:all .3s ease;-webkit-transition:all .3s ease;background-color:rgba(29,172,224,0.15);}
.zekkeiNav.top ul li.active a {height: 52px;background-color: #fff;font-weight: bold;border: 1px solid rgba(29,172,224,0.5);border-bottom:none; position: relative;}
.zekkeiNav.top ul li.active a:hover {background-color: #fff;}
.zekkeiNav.top ul li a:hover {background-color:rgba(29,172,224,0.75);color: #fff;}
@media screen and (max-width: 767px) {
    .zekkeiNav.top {margin-bottom: 50px;padding: 0;}
    .zekkeiNav.top ul {display: none;}
}
.zekkeiNav.bottom {display: block;background-color:rgba(29,172,224,0.25);padding-bottom: 20px;border-top: 1px solid rgba(29,172,224,0.5);background-color: rgba(29,172,224,0.1);background-image:radial-gradient(rgba(29,172,224,0.2) 1px, transparent 1px);background-size: 10px 10px;}
.zekkeiNav.bottom ul {text-align: center;}
.zekkeiNav.bottom ul li {display: inline-block;height: 50px;font-size: 15px;margin: -1px 5px;}
.zekkeiNav.bottom ul li a {line-height: 50px;height: 50px;color: #1789C9;display: block;padding: 0 25px;border-bottom-left-radius:5px;border-bottom-right-radius:5px;-webkit-border-bottom-left-radius:5px;-webkit-border-bottom-right-radius:5px;transition:all .3s ease;-webkit-transition:all .3s ease;background-color:rgba(29,172,224,0.15);}
.zekkeiNav.bottom ul li.active a {height: 51px;background-color: #fff;font-weight: bold;border: 1px solid rgba(29,172,224,0.5);border-top:none; position: relative;}
.zekkeiNav.bottom ul li.active a:hover {background-color: #fff;}
.zekkeiNav.bottom ul li a:hover {background-color:rgba(29,172,224,0.75);color: #fff;}
@media screen and (max-width: 767px) {
    .zekkeiNav.bottom {padding: 0 0 5px;}
    .zekkeiNav.bottom ul {font-size: 0;padding: 10px;}
    .zekkeiNav.bottom ul li {display: inline-block;height: 40px;font-size: 11px;margin: 0 0 10px;width: 50%;padding:5px; }
    .zekkeiNav.bottom ul li:nth-child(3) {display: none;}
    .zekkeiNav.bottom ul li:nth-child(4) {font-size: 10px;}
    .zekkeiNav.bottom ul li a {line-height: 40px;height: 40px;color: #FFF;display: block;padding: 0px;border-radius:5px;-webkit-border-radius:5px;transition:all .3s ease;-webkit-transition:all .3s ease;background-color:rgba(29,172,224,0.75);}
    .zekkeiNav.bottom ul li.active a {height: 40px;background-color: #fff;color: #1789C9;font-weight: bold;border: 1px solid rgba(29,172,224,0.5); position: relative;}
}

.camBtn {position: relative;margin: 0 25px;}
.camBtn::before {content: '';height: 1px;width: 100%; background-color: #1DACE0; top: 40%;left: 0;position: absolute;}
.camBtn ul {text-align: center;}
.camBtn ul li {display: inline-block;padding: 8px 8px 25px;margin: 0;}
.camBtn ul li a { position: relative;height: 50px;border: 1px solid #1DACE0;color: #1DACE0;background-color: #fff;width: 300px;display: block;line-height: 48px; font-weight: bold;font-size: 18px;transition:all .3s ease;-webkit-transition:all .3s ease;border-radius:3px;-webkit-border-radius: 3px;}
.camBtn ul li a.active {background-color:#1DACE0;color: #fff;}
.camBtn ul li a.active:before {content: "";position: absolute;top: 100%;left: 50%;margin-left: -10px;border: 10px solid transparent;border-top: 15px solid #1DACE0;}
.camBtn ul li a:hover {background-color:#1DACE0;color: #fff;}
@media screen and (max-width: 767px) {
    .camBtn {position: relative;margin: 0px -25px; padding: 0 15px;}
    .camBtn ul {text-align: center;font-size: 0;margin: 0;padding: 0;}
    .camBtn ul li {display: inline-block;padding: 8px 8px 25px;margin: 0;;width: 50%;box-sizing: border-box;-webkit-box-sizing: border-box;}
    .camBtn ul li a { position: relative;height: 40px;border: 1px solid #1DACE0;color: #1DACE0;background-color: #fff;width: auto;display: block;line-height: 38px; font-weight: bold;font-size: 16px;}
}

.zekkeiLink {}
.zekkeiLink h2 {font-weight: bold; font-size: 18px;margin-bottom: 15px;line-height: 1.6em; border-bottom: 2px solid #1DACE0;padding-bottom: 10px;}
.zekkeiLink ul {font-size: 0;margin:0 -5px 50px;padding: 0;}
.zekkeiLink ul li {display: inline-block; width: 50%;height: 50px;font-size: 14px;padding: 20px 6px 0;}
.zekkeiLink ul li a {position: relative;border: 1px solid #1DACE0;display: block;height: 50px;line-height: 50px;padding-left: 20px;color: #1DACE0;transition:all .3s ease;-webkit-transition:all .3s ease;}
.zekkeiLink ul li a .fa {position: absolute; top: 50%;right:15px;line-height: 1em;margin-top: -10px;font-size: 20px;}
.zekkeiLink ul li a:hover {background-color: #1DACE0; color: #fff;}
@media screen and (max-width: 767px) {
    .zekkeiLink {display: none;}
}

.gallery {}
.gallery .block {padding: 0px 10px;}
.gallery .block .titleBox {position: relative;margin:0 15px;padding-left: 100px;height:70px;margin-bottom: 25px;}
.gallery .block .titleBox h2 {position: absolute; top: 0;left: 0;display:block; width: 70px; height: 70px;background-color: #000;color: #fff; text-align: center; line-height:70px;font-size: 36px;border-radius:35px;-webkit-border-radius: 35px;}
.gallery .block .titleBox h2.spring {background-color:#ea68a2 ;}
.gallery .block .titleBox h2.summer {background-color:#80c269 ;}
.gallery .block .titleBox h2.autumn {background-color:#a84200 ;}
.gallery .block .titleBox h2.winter {background-color:#1DACE0 ;}
.gallery .block .titleBox h3 {font-size: 18px; font-weight: bold;line-height: 2em;}
.gallery .block ul {font-size: 0;margin-bottom: 50px;}
.gallery .block ul li {display: inline-block;width: 20%;padding: 15px;}
.gallery .block ul li a {}
.gallery .block ul li p {line-height: 1em;margin-top: 10px;text-align: center;font-size: 12px;font-family: 'Lato', sans-serif;font-weight: 400; letter-spacing: 1px;}
.gallery .block ul li a:hover {}
@media screen and (max-width: 767px) {
    .gallery .block .titleBox {position: relative;margin:0 20px;padding-left: 0px;height:auto;margin-bottom: 20px;}
    .gallery .block .titleBox h2 {position: relative; top: 0;left: 0;margin: 0 auto 20px;}
    .gallery .block .titleBox h3 {font-size: 14px; font-weight: bold;line-height:1.6em;}
    .gallery .block .titleBox h3 br {display:none;}
    .gallery .block ul {font-size: 0;margin-bottom: 25px;}
    .gallery .block ul li {display: inline-block;width: 50%;padding: 15px 15px 0;}
    
}
.znote {margin:0 25px 50px;background-color: rgba(29,172,224,0.1);padding: 30px 40px;border-radius:5px;-webkit-border-radius: 5px; border: 1px solid rgba(29,172,224,0.25)}
.znote.mnon {margin:0 0 50px;}
.znote h2 {font-weight: bold; font-size: 18px;margin-bottom: 15px;line-height: 1.6em; border-bottom: 2px solid #1DACE0;padding-bottom: 10px;}
@media screen and (max-width: 767px) {
    .znote,
    .znote.mnon {margin:0 0 25px;padding: 20px;font-size: 12px;line-height: 1.6em;}
    .znote h2 {font-size: 14px;margin-bottom: 10px;padding-bottom: 10px;}
}

.tabs { display:block;font-size: 0;text-align:center;margin:0px!important;padding:0px!important;width: 100%;height:auto;}
.tabs > li {float: left;margin:0px;padding:0px;display:block;cursor: pointer;transition:all .3s ease;-webkit-transition:all .3s ease;}
.imgArea .tabs > li {width: 20%; float: left;margin:0px;padding:0px;display:block;cursor: pointer;transition:all .3s ease;-webkit-transition:all .3s ease;}
.tabs > li figure {margin:0px!important;padding:0px!important;}
.tabs > li figure img {border:5px solid transparent;box-sizing: border-box;-webkit-box-sizing:border-box;margin: 0;padding: 0;transition:all .3s ease;-webkit-transition:all .3s ease;}
.tabs > li.active figure img,
.tabs > li:hover figure img { color:#fff;border:5px solid #1DACE0; }
.tabs > li p {padding: 0 5px; font-size: 10px;overflow: hidden;-o-text-overflow: ellipsis;-webkit-text-overflow: ellipsis;text-overflow: ellipsis;white-space: nowrap;text-align: left}
.tab_content {display: block;margin:0 0 25px;}
.tab_content .tab_inner {position: relative;display: none;margin: 0;padding:0;line-height: 0em; box-sizing: border-box; -webkit-box-sizing:border-box;}
.tab_content .tab_inner.active {display: block;}
@media screen and (max-width: 767px) {
    .tabs { display:block;  clear:both;font-size: 0;text-align:center;margin: 0px;padding: 0;height: 41px;}
    .tabs > li {margin:0 2px;padding:0px 10px;height: 20px;line-height: 20px; font-size: 11px;border-radius: 3px 3px 0 0;-webkit-border-radius: 3px 3px 0 0;}
    .tab_content .lgimg {padding:20px 0; border:3px solid #009FE8;}
    .tab_content .lgimg ul li {width: 100%;margin: 0;padding: 20px 20px 0; float:none;}
    .tab_content .lgimg ul li h2 {padding-top: 20px; font-size: 11px;letter-spacing: 0px;top: 0%;left: 10%;width: 80px; height: 80px;border-radius: 40px;-webkit-border-radius: 40px;}
    .tab_content .lgimg ul li h2 span {margin-top: 10px;font-size: 24px;}
    .tab_content .lgimg .note { text-align: center; font-size: 11px;margin-top: 10px; color: #333;}
    .imgArea .tabs {padding: 0 20px 50px!important;margin-top: -10px!important; position: relative;}
    .imgArea .tabs > li {width: 20%; float: left;margin:0px;padding:3px;display:block;cursor: pointer;transition:all .3s ease;-webkit-transition:all .3s ease;}
    .tabs > li figure img {border:3px solid transparent;}
    .tabs > li.active figure img,
    .tabs > li:hover figure img { color:#fff;border:3px solid #1DACE0; }
    .imgArea .tabs > li p {display: none;}
}

.popup {}
.popup h1 {margin:20px 20px 0px; position: relative;border: 1px solid rgba(29,172,224,0.2);background-color:rgba(29,172,224,0.15);padding: 7px 0px 7px 30px;font-size: 16px; font-weight: bold;margin-bottom: 25px;display: block;border-radius: 3px;-webkit-border-radius: 3px;}
.popup h1::before {content:''; position: absolute; top: 50%;margin-top: -3px; height: 6px; width: 15px; left: 0;background-color: rgba(29,172,224,0.2);}
.popup .imgArea {width: 100%; text-align: center}
.popup .imgArea:before,.popup .imgArea:after {content:"";display:table;}.popup .imgArea:after {clear:both;}.popup .imgArea {zoom:1;}
.popup .mainArea {width:640px;float: left;display: block;margin-left: 20px;margin-bottom: 20px;}
.popup .sideBar {width:160px;float: left;display: block;height: 480px; overflow-y: scroll;margin-left: 20px;}
.popup .sideBar ul {display: block}
.popup .sideBar ul li {display: block;margin-top: 1px;}
.popup .sideBar ul li:first-child {margin-top: 0px;}
.popup .sideBar ul li a {line-height: 30px; text-align: center; background-color: #eee;font-size: 13px;display: block;}
.popup .navi {width: 100%;}
.popup .navi ul {font-size: 0; text-align: center;}
.popup .navi ul li { font-size: 14px;display: inline-block;margin: 0 5px; }
.popup .navi ul li a {position: relative; display: block;width: 150px; line-height: 40px;padding:0 20px;background-color: rgba(29,172,224,0.25);margin-bottom: 25px;margin-top: 15px;}
.popup .navi ul li:nth-child(1) a::before {content:'';width: 0;height: 0;border-style: solid;border-width: 20px 20px 20px 0;border-color: transparent rgba(29,172,224,0.25) transparent transparent; position: absolute; top: 0;left: -20px;}
.popup .navi ul li:nth-child(2) a::before {content:'';width: 0;height: 0;border-style: solid;border-width: 20px 0 20px 20px;border-color: transparent transparent transparent rgba(29,172,224,0.25); position: absolute; top: 0;right: -20px;}
.popup .navi ul li a:hover {}
.popup .text {text-align: center;margin-bottom: 20px;}
.popup .caution {background-color:#eee;padding: 20px 25px;margin: 0 20px;font-size: 12px;line-height: 1.8em;border-radius:5px;-webkit-border-radius: 5px;}
.popup .close {display: block;width: 200px; line-height: 30px;margin: 0 auto;margin-top: 25px;margin-bottom: 25px;border: none;}
.popup .close a {display: block; border:1px solid #ccc!important; text-align: center;color:#333;}
.popup .close a:hover {}

.zsubnavi {width: 100%;display: block; height: 52px;margin: 0 25px 50px;}
.zsubnavi ul {font-size: 0;text-align: center}
.zsubnavi ul li {display: inline-block;margin: 0 10px;font-size: 14px; width: 250px;line-height: 50px;}
.zsubnavi ul li a {display: block;border: 1px solid #ccc;}
.zsubnavi ul li select {width: 100%; height: 50px;}