/*===========================================================*/
/* 個別 */
/*===========================================================*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&family=Noto+Sans+JP:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap');
body{
        font-family: "Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;
        font-weight: 500;
}
.en_font,.cms_title::before,.footer_nav{font-family: 'Oswald', sans-serif;text-transform: uppercase;}
.linkStyle{color: #333;border-bottom: 1px solid;}
h3{font-weight: 500;}
.header_menu li:last-of-type a {
    color: #fff;
    padding: 10px 12px;
    background-color: #777777;
}
#loader.load .load_logo figure{margin: 0;}
#main_img img, #catch img, #top_contents1 img, #top_contents2 img,.box_img1,.cate_img1{
    transition: ease 0.3s;
    cursor: pointer;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
}
#main_img img:hover, #catch img:hover, #top_contents1 img:hover, #top_contents2 img:hover,#contents .box_item:hover,.box_img1:hover,.cate_img1:hover,.cms_img1 img:hover{
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    filter: grayscale(0%);
}
#contents .box_item,.pc_back .span_bg ,.cms_img1 img{
    transition: ease 0.3s;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
}
#contents .no>div {
    font-style: italic;
    position: relative;
    left: -10px;
}
#main .main_box {
    top: 60%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit- transform: translateY(-50%);
    max-width: 900px;
    width: 50%;
    text-align: center;
    filter: drop-shadow(1px 3px 10px rgba(0,0,0,0.2));
    z-index: 1;
}
#main .main_box.animStart h2{font-size: 2.5vw;}
.cms_img1 span.before {
    width: 400px;
    height: 800px;
    position: absolute;
    z-index: 1;
    -webkit-transform: skewX(-26.35deg);
    transform: skewX(-26.35deg);
    left: -312px;
    top: 0;
        background-color: #4d4d4d;
}
.cms_img1 span.after {
    width: 400px;
    height: 100%;
    position: absolute;
    z-index: 0;
    -webkit-transform: skewX(-26.35deg);
    transform: skewX(-26.35deg);
    right: -380px;
    top: 0;
    background-color: #4d4d4d;
}
#main .main_box .more a{width: 100%;}
.catch_txt {
    background-color: rgb(0 0 0 / 75%);
}
.c_line {
    position: absolute;
    width: 1px;
    -webkit-transform: rotate(21.35deg);
    transform: rotate(21.35deg);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background-color: #000000;
    left: 305px;
    height: 243px;
    -webkit-transform: skewX(-26.35deg);
    transform: skewX(-26.35deg);
}
.c_line.c_line02{
    right: 170px;
    left: inherit;
    bottom: 0;
}
.left_txt{
        background-image: url(dup/img/left_txt.png);
    background-size: 90%;
    background-repeat: repeat-y;
    z-index: 1;
    background-position: center left;
        width: 87px;
    height: 100%;
    animation: loop 30s linear infinite;
}
@keyframes loop {
	0% {background-position-y: 0;}
	100% {background-position-y: -1000px;}
}
/*===========================================================*/
/* コード集 */
/*===========================================================*/




/*===========================================================*/
/* 下層 */
/*===========================================================*/





/*===========================================================*/
/* タブレット */
/*===========================================================*/
@media screen and (max-width: 768px){
#main .main_box {
    width: 70%;
}
#main .main_box h1 {
    max-width: none;
}
#main .main_box.animStart h2 {
    font-size: 24px;
}
}



/*===========================================================*/
/* スマホ */
/*===========================================================*/
@media screen and (max-width: 667px){
.cms_img1 span.before{left: -452px;}
.c_line {
    left: 160px;
}
.left_txt {
    background-size: 50%;
}
.more a:before {
    width: 170%;
}
#main .main_box {
    width: 80vw;
}
.shop_info h2{width: 100%;}
.entry.more a:after{display: none;}
.sp_back{opacity: 1!important;}
#main .main_box {
    filter: drop-shadow(1px 3px 10px rgba(0,0,0,0.8));
}
.page9 .box h3{font-size: 14px;}
}


/*===========================================================*/
/* IE */
/*===========================================================*/
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none){



}


/*===========================================================*/
/* Firefox */
/*===========================================================*/
@-moz-document url-prefix(){

}