@charset "utf-8";

/***************************************************************************
*
* INDEX STYLE
*
***************************************************************************/
.areaInstagram .slideInstagram{
	position: relative;
}
#sb_instagram #sbi_images{
	position: static!important;
}
/*SLIDETOP*/
#slideTop {
    overflow: hidden;
}

#slideTop .slideWrap {
    display: flex;
}

#slideTop .slideMarquee {
    position: relative;
}

#slideTop .slideMarquee .marRow {
    display: flex;
}

#slideTop .slideMarquee .marRow .marItem {
    width: 152px;
}

#slideTop .slideMarquee .swiper-container {
    width: 100%;
    height: 100%;
}

#slideTop .slideMarquee .swiper-container .swiper-wrapper {}

#slideTop .slideMarquee .swiper-container .swiper-slide {
    width: 152px;
    height: 152px;
    background-position: center center;
    background-size: cover;
}

/*SLIDETOP*/

/*SLIDENEWS*/
#slideNews {
    background: #4C936B;
    color: #fff;
    padding: 20px 0 21px;
}

#slideNews .newsWrap {
    display: flex;
}

#slideNews .newsWrap .newsTitle {
    width: 166px;
    position: relative;
    font-size: 24px;
    font-weight: normal;
    padding-right: 27px;
    margin-top: 12px;
    letter-spacing: -0.8px;
}

#slideNews .newsWrap .newsTitle:before {
    content: '';
    display: inline-block;
    vertical-align: -7px;
    width: 32px;
    height: 34px;
    background: url(../images/index/news-logo.svg) no-repeat center center/100%;
    margin-right: 14px;
}

#slideNews .newsWrap .newsInfo {
    display: flex;
    justify-content: space-between;
    width: calc(100% - 166px);
    border-left: 1px solid #fff;
    padding-left: 20px;
    padding-bottom: 7px;
}

#slideNews .newsWrap .newsInfo .newsSlide {
    max-width: 626px;
    margin-right: 30px;
    margin-left: 0;
}

#slideNews .newsWrap .newsInfo .newsSlide .swiper-slide {}
#slideNews .newsWrap .newsInfo .newsSlide .swiper-slide .newsTag {
    margin-top: -1px;
}
#slideNews .newsWrap .newsInfo .newsSlide .swiper-slide .newsTag .item {
    display: inline-block;
    min-width: 91px;
    font-size: 11px;
    color: #fff;
    height: 16px;
    text-align: center;
    background: #FA9B39;
    border-radius: 8px;
    margin-right: 10px;
    padding: 0 22px;
    /*box-shadow: 2px 0 6px rgba(0,0,0,0.1);*/
    line-height: 1.4;
    border: 1px solid rgba(255,255,255,0.1);
}

#slideNews .newsWrap .newsInfo .newsSlide .swiper-slide .newsName a {
    color: #fff;
    letter-spacing: -0.1px;
}

#slideNews .newsWrap .newsInfo .newsSlide .swiper-slide .newsName a:hover {
    text-decoration: underline;
}

#slideNews .newsWrap .newsInfo .newsBtn {
    margin-top: 8px;
}

#slideNews .newsWrap .newsInfo .newsBtn a {
    display: inline-block;
    width: 168px;
    color: #fff;
    border: 1px solid #fff;
    transition: all 350ms linear;
    background: transparent;
    text-align: center;
    padding: 10px 0 11px;
}

#slideNews .newsWrap .newsInfo .newsBtn a:hover {
    background: #fff;
    color: #4C936B;
}

/*SLIDENEWS*/

.titleArea {
    font-size: 36px;
    font-weight: 600;
}

.boxTitle {
    display: flex;
    align-items: baseline;
}

.boxTitle .titleArea {
    margin-right: 18px;
}

.boxTitle .titleEng {
    font-size: 21px;
    font-weight: 600;
    color: #FDCC99;
}

.buttonArea {
    width: 100%;
}

.buttonArea a {
    display: block;
    background: url(../images/index/icon-button.svg) no-repeat right 34px top 51%;
    background-size: 38px;
    background-color: rgba(255, 255, 255, 0.6);
    color: #0C3F5E;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    padding: 37px 0 29px;
    border: 3px solid #0C3F5E;
}



/*.areaCouncil*/
.areaCouncil {
    background: url(../images/index/council-brg.jpg) no-repeat top center;
    background-size: cover;
    padding: 116px 0 168px;
}

.areaCouncil .contentCouncil {
    width: 638px;
}

.areaCouncil .contentCouncil .titleArea {
    margin-bottom: 36px;
}

.areaCouncil .contentCouncil .textCouncil {
    margin-bottom: 21px;
    line-height: 1.8;
}

.areaCouncil .contentCouncil .logoCouncil {
    width: 244px;
    margin: 0 auto 51px;
}

/*areaInstagram*/
.areaInstagram {
    padding: 103px 0 111px;
}

.areaInstagram .boxTitle {
    margin-bottom: 67px;
}

.areaInstagram .slideInstagram {
    padding-top: 46px;
    margin-bottom: 47px;
}

.areaInstagram .slideInstagram .slideItem {
    text-align: center;
    margin-right: 20px;
    width: 380px;
}

.areaInstagram .slideInstagram .slideItem a {
    display: block;
}

.areaInstagram .slideInstagram .slideItem .imgSlide {
    margin-bottom: 5px;
}

.areaInstagram .slideInstagram .slideItem .nameSlide {
    color: #747474;
}

.areaInstagram .slideInstagram .slick-next {
    top: 0;
    right: 50px;
    width: 69px;
    height: 69px;
    -webkit-transition: opacity 0.4s ease;
    transition: opacity 0.4s ease;
}

.areaInstagram .slideInstagram .slick-prev {
    top: 0;
    left: -121px;
    width: 69px;
    height: 69px;
    -webkit-transition: opacity 0.4s ease;
    transition: opacity 0.4s ease;
}

.areaInstagram .slideInstagram .slick-next:before {
    content: "";
    position: absolute;
    background: url(../images/index/icon-slide-next.svg) no-repeat;
    background-size: 100%;
    width: 69px;
    height: 69px;
    top: 0;
    left: 0;
    opacity: 1;
}

.areaInstagram .slideInstagram .slick-next.slick-disabled:before {
    background: url(../images/index/icon-slide-next-dis.svg) no-repeat;
    background-size: 100%;
}

.areaInstagram .slideInstagram .slick-prev:before {
    content: "";
    position: absolute;
    background: url(../images/index/icon-slide-prev.svg) no-repeat;
    background-size: 100%;
    width: 69px;
    height: 69px;
    top: 0;
    left: 0;
    opacity: 1;
}

.areaInstagram .slideInstagram .slick-prev.slick-disabled:before {
    background: url(../images/index/icon-slide-prev-dis.svg) no-repeat;
    background-size: 100%;
}

.areaInstagram .slideInstagram .slick-prev:hover,
.areaInstagram .slideInstagram .slick-next:hover {
    opacity: 0.6;
}

.areaSpot {
    padding: 65px 0 155px;
    background: #FFFCF8;
}

.areaSpot .boxTitle {
    margin-bottom: 68px;
}
.areaSpot .boxTitle .titleArea{
    margin-right: 21px;
}
.areaSpot .boxImageSpot {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 40px;
}

.areaSpot .boxImageSpot li {
    width: calc(100% / 3 - 13.4px);
    margin-right: 20px;
}

.areaSpot .boxImageSpot li:nth-child(3n) {
    margin-right: 0;
}

/*
.swiper-container {
  height: 100px;
}
*/

@media (min-width: 1367px) {
    .areaCouncil {
        background: url(../images/index/council-brg.jpg) no-repeat center;
        background-size: cover;
    }
}

@media(min-width: 769px) {
    #sb_instagram.sbi_col_1 #sbi_images .sbi_item {
        width: 380px!important;
        margin-right: 20px!important;
    }

    .buttonArea a:hover {
        background: url(../images/index/icon-button-hover.svg) no-repeat right 33px top 51%;
        background-size: 40px;
        background-color: #0C3F5E;
        color: #fff;
    }
}

@media (max-width: 768px) {

    /*SLIDETOP*/
    #slideTop .slideMarquee .marRow .marItem {
        width: 42px;
    }

    #slideTop .slideMarquee .swiper-container .swiper-slide {
        width: 42px;
        height: 42px;
    }

    /*SLIDETOP*/

    /*SLIDENEWS*/
    #slideNews {
        padding: 10px 0;
    }

    #slideNews .newsWrap {
        flex-direction: column;
    }

    #slideNews .newsWrap .newsTitle {
        width: 100%;
        font-size: 16px;
        padding-right: 0;
        margin-top: 0;
        letter-spacing: 0;
        margin-bottom: 10px;
    }

    #slideNews .newsWrap .newsInfo {
        flex-direction: column;
        width: 100%;
        border-left: 0;
        padding-left: 0;
        padding-bottom: 0;
    }

    #slideNews .newsWrap .newsInfo .newsSlide {
        margin: 0;
        max-width: 100%;
    }
    #slideNews .newsWrap .newsInfo .newsSlide .swiper-slide .newsTag {
        margin-bottom: 2px;
    }
    #slideNews .newsWrap .newsInfo .newsSlide .swiper-slide .newsTag .item {
        padding: 0 22px;
    }
    #slideNews .newsWrap .newsInfo .newsBtn a {
        padding: 5px 0;
    }
    #slideNews .newsWrap .newsInfo .newsBtn {
        margin: 8px auto 0;
    }

    /*SLIDENEWS*/

    .titleArea {
        font-size: 22px;
    }

    .boxTitle .titleArea {
        margin-right: 10px;
    }

    .boxTitle .titleEng {
        font-size: 18px;
        letter-spacing: 1px;
    }

    .buttonArea a {
        background: url(../images/index/icon-button.svg) no-repeat right 7px top 51%;
        background-color: rgba(255, 255, 255, 0.6);
        background-size: 27px 20px;
        padding: 15px 0;
    }

    /*areaCouncil*/
    .areaCouncil {
        padding: 30px 0;
    }

    .areaCouncil .contentCouncil .titleArea {
        margin-bottom: 15px;
    }

    .areaCouncil .contentCouncil {
        width: 100%;
    }

    .areaCouncil .contentCouncil .textCouncil {
        margin-bottom: 18px;
        line-height: 1.5;
        margin-right: -2%;
        text-align: justify;
    }

    .areaCouncil .contentCouncil .logoCouncil {
        width: 100%;
        max-width: 244px;
        margin: 0 auto 30px;
    }

    /*areaInstagram*/
    .areaInstagram {
        padding: 30px 0 40px;
    }
    .areaInstagram .boxTitle {
        margin-bottom: 40px;
    }
    .areaInstagram .wrapperRight {
        padding: 0 4%;
    }

    .areaInstagram .slideInstagram .slick-prev,
    .areaInstagram .slideInstagram .slick-next,
    .areaInstagram .slideInstagram .slick-prev:before,
    .areaInstagram .slideInstagram .slick-prev.slick-disabled:before,
    .areaInstagram .slideInstagram .slick-next.slick-disabled:before,
    .areaInstagram .slideInstagram .slick-next:before {
        width: 50px;
        height: 50px;
    }

    .areaInstagram .slideInstagram .slick-prev {
        left: 10px;
    }

    .areaInstagram .slideInstagram .slick-next {
        right: 10px;
    }

    .areaInstagram .slideInstagram {
        padding-top: 40px;
        margin-bottom: 10px;
    }

    /*.areaInstagram .slideInstagram .slideItem {
        margin-right: 0;
        padding: 0 5px;
    }*/
    #sb_instagram.sbi_col_1 #sbi_images .sbi_item{
    	margin-right: 0!important;
    	padding: 0 5px!important;
    }
    #sb_instagram .sbi_photo{
    	height: 180px!important;
    }

    /*areaSpot*/
    .areaSpot {
        padding: 30px 0;
    }

    .areaSpot .boxTitle {
        margin-bottom: 30px;
    }

    .areaSpot .boxImageSpot {
        margin-bottom: 20px;
    }

    .areaSpot .boxImageSpot li {
        width: calc(100% / 2 - 5px);
        margin-right: 10px;
        margin-bottom: 10px;
    }

    .areaSpot .boxImageSpot li:nth-child(3n) {
        margin-right: 10px;
    }

    .areaSpot .boxImageSpot li:nth-child(2n) {
        margin-right: 0;
    }
}

@media (max-width: 375px) {

    #content .areaSpot .boxImageSpot li {
        width: 100%;
        margin-right: 0;
    }
}

@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 
    .areaCouncil {
        background-size: 400%;
    }
}

@media all and (-ms-high-contrast:none) {

    /*SLIDENEWS*/
    #slideNews .newsWrap .newsInfo .newsSlide .swiper-slide .newsTag {
        margin-bottom: 0;
    }

    #slideNews .newsWrap .newsInfo .newsSlide .swiper-slide .newsTag .item {
        padding-top: 1px;
    }

    #slideNews .newsWrap .newsInfo .newsBtn a {
        padding: 12px 0 9px;
    }

    /*SLIDENEWS*/

    .areaInstagram .slideInstagram .slideItem .imgSlide {
        margin-bottom: 10px;
    }
}