@import url('https://fonts.googleapis.com/css?family=Oswald&display=swap');
@import url("/common/css/cssreset.css");
@import url("/common/css/base.css");
@import url("/common/css/header.css");
@import url("/common/css/footer.css");
@import url("/common/css/navigation.css");

/* top.css */
/*--------------------------------------*/


/* key visual */
#kv {
    width:100%;
    margin:0 auto 70px;
}

/* #kv ul li.item {
    border-bottom:4px solid #004485;
}*/

#kv .item-inner {
    position:relative;
    width:100%;
    height:565px;
    background-repeat:no-repeat;
    background-position:center top;
    background-size:cover;
}

#kv .item-inner a {
    display:block;
    position:absolute;
    bottom:8%;
    left:50%;
    width:204px;
    height:54px;
    background:url("../images/slide/btn_detail.png") no-repeat center top;
    background-size:contain;
    margin-left:428px;
    text-indent:-9999px;
    transition:all .3s ease-in;
}
#kv .item-inner a:hover {
    opacity:0.7;
}

/* Dots */
#kv .slick-dotted.slick-slider {
    margin-bottom:30px;
}

#kv .slick-dots {
    display:block;
    position:absolute;
    bottom:-35px;
    width:100%;
    padding:0;
    margin:0;
    list-style:none;
    text-align:center;
}
#kv .slick-dots li {
    position:relative;
    display:inline-block;
    margin:0 4px;
    padding:0;
    cursor:pointer;
}
#kv .slick-dots li button {
    display:block;
    width:90px;
    height:20px;
    background:transparent;
    padding:4px;
    border:0;
    line-height:0;
    font-size:0;
    color:transparent;
    outline:none;
    cursor:pointer;
}
#kv .slick-dots li button:hover,
#kv .slick-dots li button:focus {
    outline:none;
}
#kv .slick-dots li button:hover:before,
#kv .slick-dots li button:focus:before {
    opacity:1;
}
#kv .slick-dots li button:before {
    position:absolute;
    top:0;
    left:0;
    width:90px;
    height:2px;
    background:#004485;
    content:'';
    text-align:center;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}
#kv .slick-dots li.slick-active button:before {
    background:#6eceff;
}


/* section common */
section p.right {text-align:right;}


/* products */
section#products {
    width:100%;
    background:url("/images/products_bg.png") no-repeat center top;
    background-size:cover;
    margin:0 auto 120px;
    padding:130px 0 60px;
}
section#products h2 {
    margin-bottom:20px;
}
section#products p {
    width:94%;
    max-width:980px;
    margin:0 auto 2em;
    font-family:'Oswald', sans-serif;
}

/* bxslider */
.bx-wrapper {
    position:relative;
    width:84%;
    max-width:1000px !important;
    margin:0 auto 20px;
    padding:0;
    *zoom:1;
    -ms-touch-action:pan-y;
    touch-action:pan-y;
}
.bx-wrapper img {
    display:block;
    max-width:100%;
    height:auto;
}
.bxslider {
    margin:0;
    padding:0;
    -webkit-perspective:1000;
}
ul.bxslider {
    list-style: none;
}
.bx-viewport {
    -webkit-transform: translateZ(0);
}

section#products ul#carousel {
    width:100%;
}
section#products ul#carousel li {
}
section#products ul#carousel li img:hover {
    opacity:0.7;
}


/* Arrows */
.bx-wrapper .bx-next,
.bx-wrapper .bx-prev {
    position:absolute;
    top:50%;
    width:30px;
    height:50px;
    background-repeat:no-repeat;
    background-position:center top;
    text-indent:-9999px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}
.bx-wrapper .bx-prev {
    left:-40px;
    background:url("/images/products_btn_prev.png");
}
.bx-wrapper .bx-prev:hover,
.bx-wrapper .bx-prev:focus {
    background-position: 0 0;
}
.bx-wrapper .bx-next {
    right:-40px;
    background:url("/images/products_btn_next.png");
}
.bx-wrapper .bx-next:hover,
.bx-wrapper .bx-next:focus {
}


/* menu */
section#menu {
    width:94%;
    max-width:1100px;
    margin:0 auto 50px;
}
section#menu .menu_block {
    position:relative;
    float:left;
    width:30%;
    margin-right:5%;
    margin-bottom:5%;z
}
section#menu .menu_block:nth-child(3n) {
    margin-right:0;
}
section#menu .menu_block h4 {
    position:absolute;
    top:-14px;
    left:0;
    right:0;
    width:18em;
    background:#004485;
    margin:0 auto;
    font-family:'Oswald', sans-serif;
    line-height:2.0;
    font-size:1.2em;
    color:#ffffff;
    z-index:2;
}
section#menu .menu_block .image {
    overflow:hidden;
}
section#menu .menu_block .image img {
    display:block;
    width:100%;
    height:auto;
    transition:all .3s ease-in;
}
section#menu .menu_block .image img:hover {
    opacity:0.7;
    transform:scale(1.1);
    transition:all .3s ease-in;
}


/* instagram */
section#instagram {
    width:100%;
    margin:0 auto 60px;
}
section#instagram h2 {
    margin-bottom:20px;
}
section#instagram h2 img {
    width:100%;
    max-width:38px;
    height:auto;
}
section#instagram img:hover {
    opacity:0.7;
}

ul#instafeed {
    line-height:0;
    letter-spacing:-0.5em;
}
ul#instafeed li {
    overflow:hidden;
    position:relative;
    display:inline-block;
    width:20%;
    margin:0;
    letter-spacing:normal;
}
ul#instafeed li:before {
    display:block;
    padding-top:100%;
    content:"";
}
ul#instafeed li img {
    display:block;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;
    vertical-align:baseline;
    transition:all .3s ease-in;
}
ul#instafeed li img:hover {
    opacity:0.7;
    transform:scale(1.1);
    transition:all .3s ease-in;
}




/* - 1280px */
/*-----------------------------------------------------------*/
@media only screen and (max-width: 1280px) {


#kv .item-inner a {
    left:inherit;
    right:3%;
    margin-left:0;
}

section#menu .menu_block h4 {
    width:90%;
    font-size: 1.8vw;
}


}
/* - 1280px end */





/* - 768px */
/*-----------------------------------------------------------*/
@media only screen and (max-width: 768px) {

/* key visual */
#kv .item-inner {
    height:0;
    background-size:contain;
    padding-top:113.33%;
}

#kv .item-inner a {
    width:33.86%;
    height:0;
    bottom:6.5%;
    right:4.5%;
    padding-top:8.93%;
}

/* Dots */
#kv .slick-dots li button {
    width:50px;
}
#kv .slick-dots li button:before {
    width:50px;
}


/* products */
section#products {
    background-image:url("/images/products_bg_sp.png");
    background-size:cover;
    margin:0 auto 80px;
    padding:60px 0 40px;
}
section#products h2,
section#products h3 {
    width:60%;
    margin:0 auto;
}
section#products h2 {
    margin:0 auto 1em;
}

/* bxslider */
.bx-wrapper {
    width:76%;
    max-width:700px !important;
}


/* menu */
section#menu {
}
section#menu .menu_block {
    position:relative;
    float:left;
    width:48%;
    margin-right:4%;
    margin-bottom:4%;
}
section#menu .menu_block:nth-child(3n) {
    margin-right:4%;
}
section#menu .menu_block:nth-child(even) {
    margin-right:0;
}
section#menu .menu_block h4 {
    position:static;
    width:100%;
    font-size: 3.4vw;
}


/* instagram */
ul#instafeed li {
    width:33.333%;
}


}
/* - 768px end */





/* - 750px */
/*-----------------------------------------------------------*/
@media only screen and (max-width: 750px) {






}
/* - 750px end */





/* - 480px */
/*-----------------------------------------------------------*/
@media only screen and (max-width: 480px) {









}
/* - 480px end */





/* - 320px */
/*-----------------------------------------------------------*/
@media only screen and (max-width: 320px) {









}
/* - 320px end */