@charset "utf-8";
@media all and (max-width:479px){

    #wrap{min-width: 280px !important}
    
    header{height: 60px;position: relative}
    #header-wrap{margin: 0 0 0 0}
    #header-wrap h1{text-align: center;width: 100%}
    #header-wrap h1 span{line-height: 60px}
    #header-wrap h1 a{display: inline-block}
    #header-wrap .header-btn{line-height: 60px}
    #header-wrap .header-btn span{
        padding: 5px 10px;
        font-size: 12px;
        line-height: 20px;
    }
    
    .header-nav-pc,.logo-pc{display: none}
    .header-nav-mobile,.logo-mobile,.nav-mobile-btn{display: block}

    #header-wrap .header-nav-mobile p{}
    #header-wrap .header-nav-mobile:hover{cursor: pointer}
    #header-wrap .header-btn{position: absolute;right: 20px;top:0}

    .content,#footer-wrap{padding: 0 20px;min-width: 280px !important}

    .content-vis{padding: 40px 0}
    .vis-wrap{
        display: flex;
        flex-direction: column-reverse;
        justify-content: center;
        padding-top: 40px;
        padding-bottom: 40px;
        box-sizing: border-box;
        width: 100%;
        margin: 0 auto;
        padding-right: 20px;
        padding-left: 20px;
    }
    .vis-wrap .vis-text{
        text-align: center;
        margin: 20px 0 0 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        max-width: 624px;
    }
    .vis-text .headline{
        font-size: 24px;
        font-weight: 600;
        line-height: 29px;
    }
    .vis-wrap .vis-shot{
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        color: #d2d2d2;
    }
    .vis-wrap .vis-shot figure{
        width: 100%;
        /*height: 300px;*/
    }
    .vis-wrap .vis-shot figure img{
        object-fit: contain;
        height: 300px;
    }
    
    .content-nav{position: relative;height: 90px}
    .nav-select-box{width: 120px;left: 0;position: absolute}
    .nav-fillter-box{width: 120px;right: 0;top:30px;position: absolute}
    .content-nav .content-nav-slide ul{width: 100%;position: absolute;top:90px}
    .content-main ul li{width: 100%}

    #footer-wrap{
        padding-right: 32px;
        padding-left: 32px;
    }
    .site-footer .footer-main-content{
        padding: 48px 0 32px;
        flex-direction: column;
        display: flex;
        border-bottom: 1px solid #e7e7e9;
    }
    
    .site-footer .links-container{
        flex-wrap: wrap;
        display: flex;
    }
    
    .site-footer .links-column{
        width:50%;
    }
    
    .footer-lower-content{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        padding:32px 0;
        color:#6e6d7a;
    }
    .total-shots-container{
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
    }

}
@media all and (min-width:480px) and (max-width:767px){

    #wrap{min-width: 280px !important}
    
    header{height: 60px;position: relative}
    #header-wrap{margin: 0 0 0 0}
    #header-wrap h1{text-align: center;width: 100%}
    #header-wrap h1 span{line-height: 60px}
    #header-wrap h1 a{display: inline-block}
    #header-wrap .header-btn{line-height: 60px}
    #header-wrap .header-btn span{
        padding: 5px 10px;
        font-size: 12px;
        line-height: 20px;
    }
    
    .header-nav-pc,.logo-pc{display: none}
    .header-nav-mobile,.logo-mobile,.nav-mobile-btn{display: block}

    #header-wrap .header-nav-mobile p{}
    #header-wrap .header-nav-mobile:hover{cursor: pointer}
    #header-wrap .header-btn{position: absolute;right: 20px;top:0}

    .content,#footer-wrap{padding: 0 20px;min-width: 280px !important}

    .content-vis{padding: 40px 0}
    .vis-wrap{
        display: flex;
        flex-direction: column-reverse;
        justify-content: center;
        padding-top: 40px;
        padding-bottom: 40px;
        box-sizing: border-box;
        width: 100%;
        margin: 0 auto;
        padding-right: 20px;
        padding-left: 20px;
    }
    .vis-wrap .vis-text{
        text-align: center;
        margin: 20px 0 0 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        max-width: 624px;
    }
    .vis-text .headline{
        font-size: 24px;
        font-weight: 600;
        line-height: 29px;
    }
    .vis-wrap .vis-shot{
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        color: #d2d2d2;
    }
    .vis-wrap .vis-shot figure{
        width: 100%;
        /*height: 300px;*/
    }
    .vis-wrap .vis-shot figure img{
        object-fit: contain;
        height: 300px;
    }
    
    .content-nav{position: relative;height: 90px}
    .nav-select-box{width: 120px;left: 0;position: absolute}
    .nav-fillter-box{width: 120px;right: 0;top:30px;position: absolute}
    .content-nav .content-nav-slide ul{width: 100%;position: absolute;top:90px}
    .content-main ul li{width: 100%}

    #footer-wrap{
        padding-right: 32px;
        padding-left: 32px;
    }
    .site-footer .footer-main-content{
        padding: 48px 0 32px;
        flex-direction: column;
        display: flex;
        border-bottom: 1px solid #e7e7e9;
    }
    
    .site-footer .links-container{
        flex-wrap: wrap;
        display: flex;
    }
    
    .site-footer .links-column{
        width:50%;
    }
    
    .footer-lower-content{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        padding:32px 0;
        color:#6e6d7a;
    }
    .total-shots-container{
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
    }

}
@media all and (min-width:768px) and (max-width:919px){

    header{height: 60px;position: relative}
    #header-wrap{margin: 0 0 0 0}
    #header-wrap h1{text-align: center;width: 100%}
    #header-wrap h1 span{line-height: 60px}
    #header-wrap h1 a{display: inline-block}
    #header-wrap .header-btn{line-height: 60px}
    #header-wrap .header-btn span{
        padding: 5px 10px;
        font-size: 12px;
        line-height: 20px;
    }
    
    .header-nav-pc,.logo-pc{display: none}
    .header-nav-mobile,.logo-mobile,.nav-mobile-btn{display: block}

    #header-wrap .header-nav-mobile p{}
    #header-wrap .header-nav-mobile:hover{cursor: pointer}
    #header-wrap .header-btn{position: absolute;right: 20px;top:0}

    .content,#footer-wrap{padding: 0 20px;min-width: 280px !important}

    .content-vis{padding: 40px 0}
    .vis-wrap{
        display: flex;
        flex-direction: column-reverse;
        justify-content: center;
        padding-top: 40px;
        padding-bottom: 40px;
        box-sizing: border-box;
        width: 100%;
        margin: 0 auto;
        padding-right: 20px;
        padding-left: 20px;
    }
    .vis-wrap .vis-text{
        text-align: center;
        margin: 20px 0 0 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        max-width: 624px;
    }
    .vis-text .headline{
        font-size: 24px;
        font-weight: 600;
        line-height: 29px;
    }
    .vis-wrap .vis-shot{
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        color: #9e9ea7;
    }
    .vis-wrap .vis-shot figure{
        width: 100%;
        /*height: 300px;*/
    }
    .vis-wrap .vis-shot figure img{
        object-fit: contain;
        height: 300px;
    }
    
    .content-nav{position: relative;height: 90px}
    .nav-select-box{width: 120px;left: 0;position: absolute}
    .nav-fillter-box{width: 120px;right: 0;top:30px;position: absolute}
    .content-nav .content-nav-slide ul{width: 100%;position: absolute;top:90px}
    
    .content-main ul{overflow: hidden}
    .content-main ul li{width: 50%;float: left}

    #footer-wrap{
        padding-right: 32px;
        padding-left: 32px;
    }
    .site-footer .footer-main-content{
        padding: 48px 0 32px;
        flex-direction: column;
        display: flex;
        border-bottom: 1px solid #e7e7e9;
    }
    
    .site-footer .links-container{
        flex-wrap: wrap;
        display: flex;
    }
    
    .site-footer .links-column{
        width:50%;
    }
    
    .footer-lower-content{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        padding:32px 0;
        color:#6e6d7a;
    }
    .total-shots-container{
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
    }
    
}
@media all and (min-width:920px) and (max-width:1199px){

    header{height: 80px;position: relative}
    #header-wrap{margin: 0 24px}
    #header-wrap h1{
        float: left;
        margin: 0 30px 0 0;
    }
    #header-wrap h1 span{line-height: 80px}
    #header-wrap .header-btn{line-height: 80px}
    #header-wrap .header-btn span{
        padding: 10px 16px;
        font-size: 14px;
        line-height: 18px;
    }
    
    .header-nav-pc,.logo-pc{display: block}
    .header-nav-mobile,.logo-mobile,.nav-mobile-btn{display: none}

    .content,#footer-wrap{padding: 0 32px}
    .content-vis{height: 480px}

    .vis-wrap{
        flex-direction: row;
        justify-content: space-between;
        height: 480px;
        padding-top: 0;
        padding-bottom: 0;
        display: flex;
        padding-right: 32px;
        padding-left: 32px;
    }
    .vis-wrap .vis-text{
        text-align: left;
        align-items: flex-start;
        margin-top: 0;
        flex-direction: column;
        max-width: 624px;
    }
    .vis-wrap .vis-text .headline{
        font-size: 32px;
        font-weight: 700;
        line-height: 38px;
    }
    .vis-wrap .vis-text .description{
        margin: 16px 0;
    }
    
    .vis-wrap .vis-shot{
        align-items: flex-end;
        width: auto;
        display: flex;
        color: #9e9ea7;
        font-size: 14px;
        font-weight: 400;
        line-height: 20px;
    }
    .vis-wrap .vis-shot img{
        width: 400px;
        height: 266px;
        object-fit: contain;
    }
    
    .content-nav{position: relative}
    .nav-select-box{width: 120px;left: 0;position: absolute}
    .nav-fillter-box{width: 120px;right: 0;top:30px;position: absolute}
    
    .content-nav .content-nav-slide ul{width: 600px}
    
    .content-main ul{overflow: hidden}
    .content-main ul li{float: left;width:33.3%}

    #footer-wrap{
        padding-right: 72px;
        padding-left: 72px;
    }
    .site-footer .footer-main-content{
        padding: 48px 0 32px;
        flex-direction: column;
        display: flex;
        border-bottom: 1px solid #e7e7e9;
    }
    
    .site-footer .links-container{
        flex-wrap: nowrap;
        display: flex;
    }
    
    .site-footer .links-column{
        margin-right: 0;
        width:144px;
        margin-left: 60px;
    }
    
    .site-footer .footer-lower-content{
        flex-direction: row;
        padding:44px 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: #6e6d7a;
    }
    .site-footer .total-shots-container{
        flex-direction: row;
        display: flex;
        align-items: center;
    }

}
@media all and (min-width:1200px) and (max-width:1659px){

    header{height: 80px;position: relative}
    #header-wrap{margin: 0 24px}
    #header-wrap h1{
        float: left;
        margin: 0 30px 0 0;
    }
    #header-wrap h1 span{line-height: 80px}
    #header-wrap .header-btn{line-height: 80px}
    #header-wrap .header-btn span{
        padding: 10px 16px;
        font-size: 14px;
        line-height: 18px;
    }
    
    .header-nav-pc,.logo-pc{display: block}
    .header-nav-mobile,.logo-mobile,.nav-mobile-btn{display: none}

    .content,#footer-wrap{padding: 0 72px}
    .content-vis{
        height: 480px;   
    }
    .vis-wrap{
        flex-direction: row;
        justify-content: space-between;
        padding-right: 72px;
        padding-left: 72px;
        display: flex;
        max-width: 1652px;
        height: 480px;
        
    }
    .vis-wrap .vis-text{
        margin-top: 0;
        text-align: left;
        align-items: flex-start;
        flex-direction: column;
        max-width: 624px;
        text-align: left;
        
    }
    .vis-wrap .vis-text .headline span{
        font-size: 48px;
        font-weight: 700;
        line-height: 56px;
        color: #0d0c22;
    }
    .vis-wrap .vis-text .description span{
        font-weight: 400;
        line-height: 28px;
        color: #0d0c22;
    }
    
    .vis-wrap .vis-shot{
        align-items: flex-end;
        width: auto;
        display: flex;
        font-size: 14px;
        font-weight: 400;
        line-height: 20px;
        
    }
    .vis-wrap .vis-shot img{
        object-fit: contain;
        width: 510px;
        height: 360px;
    }
    
    .content-nav{position: relative}
    .nav-select-box{width: 120px;left: 0;position: absolute}
    .nav-fillter-box{width: 120px;right: 0;top:30px;position: absolute}
    .content-nav .content-nav-slide ul{width: 800px}
    
    .content-main ul{overflow: hidden}
    .content-main ul li{float: left;width:25%}

    #footer-wrap{
        padding-right: 72px;
        padding-left: 72px;
    }
    
    .site-footer .footer-main-content{
        padding: 72px 0;
        flex-direction: row;
        display: flex;
        border-bottom: 1px solid #e7e7e9;
    }
    
    .site-footer .links-container{
        flex-wrap: nowrap;
        display: flex;
    }
    
    .site-footer .links-column{
        margin-right: 0;
        width:144px;
        margin-left: 60px;
    }
    
    .site-footer .footer-lower-content{
        flex-direction: row;
        padding:44px 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: #6e6d7a;
    }
    .site-footer .total-shots-container{
        flex-direction: row;
        display: flex;
        align-items: center;
    }
}
@media all and (min-width:1660px){
    
    header{height: 80px;position: relative}
    #header-wrap{margin: 0 24px}
    #header-wrap h1{
        float: left;
        margin: 0 30px 0 0;
    }
    #header-wrap h1 span{line-height: 80px}
    #header-wrap .header-btn{line-height: 80px}
    #header-wrap .header-btn span{
        padding: 10px 16px;
        font-size: 14px;
        line-height: 18px;
    }
    
    .header-nav-pc,.logo-pc{display: block}
    .header-nav-mobile,.logo-mobile,.nav-mobile-btn{display: none}

    .content,#footer-wrap{padding: 0 72px}
    .content-vis{
        height: 480px;
    }

    .vis-wrap{
        max-width: 1680px !important;
        padding-right: 72px;
        padding-left: 72px;
        width: 1680px;
    }

    .vis-wrap{flex-direction: row;height: 480px}
    .vis-wrap .vis-text{
        text-align: left;
        max-width: 624px;
        margin-left: 100px;
    }
    .vis-text .headline span{
        font-size: 48px;
        font-weight: 600;
        line-height: 56px;
    }
    .vis-shot{
        align-items: flex-end;
        width: auto;
    }
    .vis-shot figure{
        width: 510px;
        height: 360px;
        
    }
    .vis-shot figure img{
        object-fit: contain;
    }

    .content-nav{position: relative}
    .nav-select-box{width: 120px;left: 0;position: absolute}
    .nav-fillter-box{width: 120px;right: 0;top:30px;position: absolute}
    
    .content-nav .content-nav-slide ul{width: 1000px}
    
    .content-main ul{overflow: hidden}
    .content-main ul li{float: left;width:25%}

    #footer-wrap{
        padding-right: 72px;
        padding-left: 72px;
    }
    .site-footer .footer-main-content{
        padding: 72px 0;
        flex-direction: row;
        display: flex;
        border-bottom: 1px solid #e7e7e9;
    }
    
    .site-footer .links-container{
        flex-wrap: nowrap;
        display: flex;
    }
    
    .site-footer .links-column{
        margin-right: 0;
        width:144px;
        margin-left: 60px;
    }
    
    .site-footer .footer-lower-content{
        flex-direction: row;
        padding:44px 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: #6e6d7a;
    }
    .site-footer .total-shots-container{
        flex-direction: row;
        display: flex;
        align-items: center;
    }
    
}

#wrap{width:100% !important;position: relative}
header{width: 100%}

/*psst*/
#psst{
    width: 100%;
    position: relative;
    z-index: 1;
    background: #0d0c22;
    color: #fff;
    font-size: 13px;
    line-height: 1.3;
}
#psst div {
    color: #fff;
    text-align: center;
}
#psst div p span a{
    color: #51effc;
}
/*psst end*/


#header-wrap{}

#header-wrap .header-nav-pc{float: left}
#header-wrap .header-nav-pc ul li{
    float: left;
    position: relative;
    padding-right: 16px;
    padding-left: 16px;
    color: #6e6d7a;
}
#header-wrap .header-nav-pc ul li span{
    padding: 0 10x;
    display: inline-block;
    line-height: 80px;
    font-weight: 500;
    color: inherit;
}
#header-wrap .header-nav-pc ul li span > a{height: 100%;display: inline-block}

.nav-pc-hover-menu{
    display: flex;
    visibility: hidden;
    position: absolute;
    /*z-index: 1;
    top: 85%;
    left: -28px;*/
    z-index: 10;
    top:85%;
    left: -28px;
    border-radius: 12px;
    opacity: 0;
    box-shadow: 0px 10px 70px rgb(0 0 0 / 15%);
    overflow: hidden;
}
.nav-pc-hover-menu ul{
    
}
.nav-pc-hover-menu ul li{
    width: 100%;
    color: #6e6d7a;
    font-weight: 500;
    line-height: 20px;
}

.nav-pc-hover-menu ul li .icon-container{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin-right: 16px;
    transition: background-color 200ms ease;
    border-radius: 6px;
    background: #f8f8f8;
    box-sizing: border-box;
}
.nav-pc-hover-menu ul li .item-text{
    flex-grow: 1;
    max-width: 85%;
}
.nav-pc-hover-menu ul li .item-text .headline{
    display: flex;
    align-items: center;
    color: #0d0c22;
    font-family: "Haas Grot Text R Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}
.nav-pc-hover-menu ul li .item-text .description{
    word-break: break-word;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin-top: 4px;
    color: #6e6d7a;
}

.nav-dropdown-list{
    width: 400px;
    padding: 16px 0;
    border-radius: 12px;
    background: #fff;
    box-sizing: border-box;
}

.white-bg{
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    width: 400px;
    padding: 16px 0;
    border-radius: 12px;
    background: #fff;
}
.white-bg li a{
    align-items: center;
    color: inherit;
    margin: 0 22px;
    padding: 15px 18px;
    transition: background-color 200ms ease;
    border-radius: 12px;
    background-color: #fff;
    display: flex;
}

.gray-bg{
    width: 200px;
    padding: 24px 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    background: #f8f8f8;
    border-radius: 12px;
}
.gray-bg p{
    display: flex;
    align-items: center;
    color: #0d0c22;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    padding: 9px 36px;
    box-sizing: border-box;
}
.gray-bg a{
    color: #6e6d7a;
    font-weight: 400;
    align-items: center;
    display: block;
    padding: 9px 36px;
}

#header-wrap .header-nav-mobile{
    
}
#header-wrap .header-nav-mobile .nav-mobile{
    z-index: 10;
    width: 100%;
    height: 100%;
    background: #fff;
    display: none;
    left: 0;
    top:60px;
    border-top:1px solid #ccc;

    padding: 23px 23px 120px;
    position: absolute;
    z-index: 10;
    width: 100%;
    height: calc(100vh - 60px);
    overflow: scroll;
    background: #fff;
    box-shadow: 0px 20px 35px rgb(13 12 34 / 5%);
    margin: 0;
}
#header-wrap .header-nav-mobile .nav-mobile ul li{width: 100%}
#header-wrap .header-nav-mobile .nav-mobile ul li .nav-mobile-form{
    position: relative;
    margin-bottom: 12px;
    box-sizing: border-box;
}
#header-wrap .header-nav-mobile .nav-mobile ul li input{
    padding-right: 32px;
    padding-left: 32px;
    color: #222 !important;
}
#header-wrap .header-nav-mobile .nav-mobile ul li input[type="search"]{
    border: 1px solid transparent;
    box-sizing: border-box;
    width: 95%;
    height: 40px;
    padding: 10px 16px;
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    border-radius: 8px;
    outline: none;
    background-color: #f3f3f4;
    appearance: none;
}

#header-wrap .header-nav-mobile .nav-mobile ul li input:hover{
    box-shadow: inset 0px -1px 0px #f3f3f4;
}

#header-wrap .header-nav-mobile .nav-mobile ul li label{
    display: block;
    position: relative;
    margin-bottom: 0;
    cursor: pointer;
    justify-content: space-between;
    padding-top: 12px;
    padding-bottom: 12px;
    color: #6e6d7a;
    font-size: 18px;
    font-weight: 500;
    user-select: none;
    box-sizing: border-box;
}
#header-wrap .header-nav-mobile .nav-mobile ul li label:after{
    content: '';
    position: absolute;
    right: 0;
    width: 16px;
    height: 16px;
    background-color: #6e6d7a;
    -webkit-mask-image: url('http://www.w3.org/2000/svg');
}

#header-wrap .header-nav-mobile .nav-mobile ul li ul{display: none}
#header-wrap .header-nav-mobile .nav-mobile ul li ul div{
    margin-top: 15px;
    margin-bottom: 15px;
    padding-left: 32px;
    border-left: 1px solid #e7e7e9;
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
}
#header-wrap .header-nav-mobile .nav-mobile ul li ul div li{
    display: inline-block;
    width: 100%;
}
#header-wrap .header-nav-mobile .nav-mobile ul li ul div li span{
    display: block;
    padding-top: 12px;
    padding-bottom: 12px;
    color: #6e6d7a;
    text-decoration: none;
}

#header-wrap .header-btn{float: right}
#header-wrap .header-btn span{
    display: inline-block;
    border-radius:8px;
    background: #5B6566;
    color: #fff;
    vertical-align: middle;
    height: 20px;
    
    font-weight: 500;
}
#header-wrap .header-btn span:hover{cursor: pointer}

h1 span{line-height: 77px}
h1 span img:hover{
    opacity: 0.5;
    transition: 0.4s;
}
h1 span .logo-pc{width: 100px}
h1 span .logo-mobile{width: 34px;margin: 0 auto}
h1 span img{width: 100%;vertical-align: middle}

/*nav-mobile*/
.nav-mobile-btn{width: 100%;position: absolute;height: 50px;top:0;left: 20px}
.nav-mobile-btn p span{width: 22px;display: inline-block;line-height: 60px}
.nav-mobile-btn p span:hover{cursor: pointer}
.nav-mobile-btn p span i img{width: 100%;vertical-align: middle}
/*nav-mobile end*/

/*main contatiner*/
main{width: 100%}
.container{width:inherit}
.content{margin: 0 auto}

/*main-visual*/
.content-vis{/*background: #D0E8EA*/background:#191718;border-top:1px solid #ccc;border-bottom: 1px solid #ccc;padding: 50px 0;/*background: #f9f9f9*/}

/*main-visual-text*/
.vis-wrap{
    overflow: hidden;
    width: 90%;
    margin: 0 auto;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding-top: 0;
    padding-bottom: 0;
}
.vis-wrap > div{
    flex-direction: column;
    align-items: flex-start;
    margin-top: 0;
}
.vis-wrap .vis-text p{}
.vis-wrap .vis-text .subheadline span{
    font-weight: 300;
    color: #f6f4f5;
}
.vis-wrap .vis-text .headline span{
    font-weight: 700;
    color: #fff;
    letter-spacing: -.065em;
}
.vis-wrap .vis-text .description span{
    padding: 16px 0;
    font-weight: 400;
    line-height: 28px;
    color: #fff;
}
.vis-wrap .vis-text .title-btn span{
    display: inline-block;
    border-radius:8px;
    background: #5B6566;
    color: #fff;
    vertical-align: middle;
    height: 20px;
    padding: 10px 16px;
    font-size: 14px;
    font-weight: 500;
    line-height: 18px;
}
.vis-wrap .vis-text p span{display: block}

/*main-visual-img*/
.vis-wrap .vis-shot p span{
    color: #9e9ea7;
    font-weight: 300;
    line-height: 20px;
    padding: 15px 0 0 0;
}
.vis-wrap .vis-shot p span a{text-decoration: underline}

/*content*/
/*content-nav*/
.content-nav{width: 100%;padding: 32px 0 0 0}
.content-nav .nav-select{float: left}
.content-nav .nav-select > p{border:1px solid #e9e9e9;border-radius: 8px}
.content-nav .nav-select > p span{padding: 0 10px}

.nav-select-box{z-index: 1}
.nav-select-box > p{
    padding: 10px 10px;
    border:1px solid rgba(0,0,0,0.05);
    border-radius: 8px;
}
.nav-select-box > p:hover{cursor: pointer}
.nav-select-option{
    display: none;
    z-index: 2;
    position: absolute;
    /*top: calc(100% + 8px);*/
    top:80px;
    left: 0;
    min-width: 180px;
    border:1px solid rgba(0,0,0,0.05);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0px 3px 5px rgb(0 0 0 / 4%);
    overflow: hidden;
}

.nav-select-option p:first-child span:first-child{color: #82d8de}
.nav-select-option span{
    display: block;
    padding: 10px 10px;
}
.nav-select-option p:last-child span:last-child{
    border-top: 1px solid rgba(0,0,0,0.05)
}
.nav-select-option p span:hover{background: #ccc;cursor: pointer}

.selected_btn{background: #f3f3f4;font-weight: 700;color: #0d0c22}

/*content-slide*/
.content-nav{}
.content-nav .content-nav-slide ul{overflow: hidden;margin: 0 auto}
.content-nav .content-nav-slide ul li{float: left;text-align: center}
.content-nav .content-nav-slide ul li span{display: block;padding: 10px 10px}

.content-nav .content-nav-slide{}
.content-nav .content-nav-slide .slick-btn{position: absolute;top:0;width: 100%;background: #e9e9e9}
.content-nav .content-nav-slide .slick-btn ul{width: inherit}
.content-nav .content-nav-slide .slick-btn ul li{position: absolute;top:0}
.content-nav .content-nav-slide .slick-btn ul li:first-child{left: 0}
.content-nav .content-nav-slide .slick-btn ul li:first-child i{
    transform: rotate(180deg);
}
.content-nav .content-nav-slide .slick-btn ul li:last-child{right: 0}

.content-nav .content-nav-slide .slick-btn ul li i{width: 20px;display: inline-block}
.content-nav .content-nav-slide .slick-btn ul li i img{width: 100%;vertical-align: middle}


/*nav-fillter-box*/
.nav-fillter-box{z-index: 1}
.nav-fillter-btn{
    padding: 10px 10px;
    border:1px solid rgba(0,0,0,0.05);
    border-radius: 8px;
}
.nav-fillter-btn:hover{
    cursor: pointer;
}

/*content-main*/
.content-main{padding: 32px 0 0 0}
.content-main ul li{margin: 0 auto 20px auto}
.content-main ul li section{width: 95%;margin: 0 auto;}
.content-main ul li section figure{border:1px solid #ccc;border-radius: 8px;overflow: hidden}

.content-main ul li section p{overflow: hidden;height: 50px}
.content-main ul li section p span{
    float: left;
    margin: 0 3px 0 0;
}
.content-main ul li section p .profile{
    border-radius: 100%;
    width: 30px;
    height: 30px;
    background: url(../../images/muesign/logo/logo_symbole_silver.svg),#fff;
    background-size:100% 58%, 100% 100%;
    background-position:0px 50% ,0px 0px;
    background-repeat: no-repeat, no-repeat;
    display: inline-block;
    vertical-align: middle;
    margin: 10px 4px 0 auto;
    font-weight: 700;
    letter-spacing: -0.4px;
    color: #222;
    border:1px solid #ccc;
}
.content-main ul li section p .title{
    line-height: 50px;
    margin: 0 8px 0 0;
}
.content-main ul li section p .category{
    background: #555;
    border-radius: 3px;
    color: #fff;
    font-size: 12px;
    padding: 4px 10px;
    margin: 12px 0 0 0;
}

/*footer*/
footer{
    width: 100%;
    position: relative;
    background: #fafafb;
    flex-shrink:0;
}
/*footer-top*/

.site-footer{
    border-bottom: #fafafb;
    color: #3d3d4e;
    font-weight: 400;
    line-height: 20px;
}
#footer-wrap {
    max-width: 1680px;
    width: 100%;
    margin:0 auto;
    box-sizing: border-box;
    
}

.footer-main-content{
    display: flex;
    
    flex-direction: column;
    padding: 48px 0 32px;
    border-bottom: 1px solid #e7e7e9;
}
.footer-main-content i{width: 100px;display: inline-block}
.footer-main-content i img{width: 100%}

.accessibility-text{
    position: absolute;
    width: 0;
    overflow: hidden;
    opacity: 0;
}

/**/
.tagline{
    max-width: 256px;
    margin: 20px 0;
}


.links-column{
    font-weight: 400;
    line-height: 20px;
}
.link-heading{
    
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: #0d0c22;
    margin-top:32px;
}
.link{
    display: block;
    margin-top:16px;
    color:#3d3d4e;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}
a:link{
    text-decoration: none;
}

.total-shots-container .shots-count{
    color: #0d0c22;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
}

figure{width: 100%}
figure img{width: 100%}
figcaption{
    display: none
}