/*++++++++++++++++++++++++++++++++@font-face++++++++++++++++++++++++++++++++*/


/* Noto Sans */

@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 100;
    src: url("../fonts/NotoSansCJKjp-Thin.eot");
    /* IE9 Compat Modes */
    src: url("../fonts/NotoSansCJKjp-Thin.eot?#iefix") format("embedded-opentype"), url("../fonts/NotoSansCJKjp-Thin.woff") format("woff"), url("../fonts/NotoSansCJKjp-Thin.ttf") format("truetype");
    /* Safari, Android, iOS */
}

@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 200;
    src: url("../fonts/NotoSansCJKjp-Light.eot");
    src: url("../fonts/NotoSansCJKjp-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/NotoSansCJKjp-Light.woff") format("woff"), url("../fonts/NotoSansCJKjp-Light.ttf") format("truetype");
}

@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 300;
    src: url("../fonts/NotoSansCJKjp-DemiLight.eot");
    src: url("../fonts/NotoSansCJKjp-DemiLight.eot?#iefix") format("embedded-opentype"), url("../fonts/NotoSansCJKjp-DemiLight.woff") format("woff"), url("../fonts/NotoSansCJKjp-DemiLight.ttf") format("truetype");
}

@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/NotoSansCJKjp-Regular.eot");
    src: url("../fonts/NotoSansCJKjp-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/NotoSansCJKjp-Regular.woff") format("woff"), url("../fonts/NotoSansCJKjp-Regular.ttf") format("truetype");
}

@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 500;
    src: url("../fonts/NotoSansCJKjp-Medium.eot");
    src: url("../fonts/NotoSansCJKjp-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/NotoSansCJKjp-Medium.woff") format("woff"), url("../fonts/NotoSansCJKjp-Medium.ttf") format("truetype");
}

@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 700;
    src: url("../fonts/NotoSansCJKjp-Bold.eot");
    src: url("../fonts/NotoSansCJKjp-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/NotoSansCJKjp-Bold.woff") format("woff"), url("../fonts/NotoSansCJKjp-Bold.ttf") format("truetype");
}

@font-face {
    font-family: 'Noto Sans Japanese';
    font-style: normal;
    font-weight: 900;
    src: url("../fonts/NotoSansCJKjp-Black.eot");
    src: url("../fonts/NotoSansCJKjp-Black.eot?#iefix") format("embedded-opentype"), url("../fonts/NotoSansCJKjp-Black.woff") format("woff"), url("../fonts/NotoSansCJKjp-Black.ttf") format("truetype");
}

html {
    font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, 'MS Pゴシック', "Noto Sans", "Noto Sans Japanese", sans-serif;
    font-size: 10px;
}

body {
    background: #000;
    color: #fff;
    font-size: 1.6rem;
    line-height: 3rem;
}

.uk-navbar {
    position: fixed;
    left: -2rem;
    top: 0;
    width: 100%;
    z-index: 999;
    background: none !important;
}

.uk-navbar a.uk-icon svg {
    width: 4rem;
    color: #eee;
}

.uk-navbar a.uk-icon:hover svg {
    opacity: 0.8;
}

.uk-offcanvas {
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
}

.uk-offcanvas-bar {
    padding: 7rem 0 0;
    background: #000;
}

.uk-nav-offcanvas {
    border-bottom: 1px solid #fff;
}

.uk-nav-offcanvas li {
    border-top: 1px solid #fff;
    padding: 1rem;
    text-align: center;
}

.uk-nav-offcanvas li:hover {
    background: #fff;
    color: #000;
}

.uk-nav-offcanvas li:hover a {
    color: #000;
}

.uk-offcanvas-close {
    width: 4rem;
    height: 4rem;
    right: 1rem;
}

.uk-offcanvas-close svg {
    width: 3rem;
    color: #ddd;
}


/* TOP animation START -------- */

.hero {
    text-align: center;
    height: 100vh;
    overflow: hidden;
}

.hero img.main {
    max-width: 100%;
    max-height: 100%;
}

.hero-inner {
    display: inline-block;
    height: 100%;
    position: relative;
    display: none;
}

.hero-inner>div {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.hero .scene1 {
    background-image: url(../img/mv1.png);
    z-index: 4;
}

.hero .scene1-tit {
    background-image: url(../img/mv-opening-title.png);
    z-index: 3;
}

.hero .scene2 {
    background-image: url(../img/mv2.png);
    animation: parapara 0.5s steps(5) 3s;
    z-index: 4;
}

.hero .scene2-bg {
    background: #000;
    opacity: 0;
    animation: show-mv 0s ease 4.5s 1 forwards;
    z-index: 3;
}

.hero .scene2-saurus {
    background-image: url(../img/mv2-1.png);
    opacity: 0;
    animation: show-mv 0s ease 5s 1 forwards;
    z-index: 4;
}

.hero .scene3 {
    background-image: url(../img/mv3.png);
    opacity: 0;
    animation: show-mv 0s ease 5.5s 1 forwards;
    z-index: 5;
}

.hero .scene4 {
    background-image: url(../img/mv4.png);
    opacity: 0;
    animation: show-mv 0s ease 6s 1 forwards;
    z-index: 6;
}

.hero .scene5 {
    background-image: url(../img/mv5.png);
    opacity: 0;
    animation: show-mv 0s ease 6.5s 1 forwards;
    z-index: 7;
}

.hero .scene6 {
    background-image: url(../img/mv-title1.png);
    transform: translateY(-800px);
    opacity: 0;
    animation: bound 0.8s ease 7s 1 forwards;
    z-index: 8;
}

.hero .scene7 {
    background-image: url(../img/mv-title2.png);
    transform: translateY(-800px);
    opacity: 0;
    animation: bound 0.8s ease 7.3s 1 forwards;
    z-index: 8;
}

.hero .scene8 {
    background-image: url(../img/mv-title.png);
    transform: translateY(-800px);
    opacity: 0;
    animation: bound 0.8s ease 8s 1 forwards;
    z-index: 8;
}

.hero .scene8 img {
    display: none;
}

.hero .scene1-tit:before {
    animation: img-wrap 4s cubic-bezier(.4, 0, .2, 1) forwards;
    background: #000;
    bottom: 0;
    content: '';
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    bottom: 0;
    height: 100%;
    z-index: 1;
}

@keyframes parapara {
    0% {
        transform: translateX(-3px);
    }
    10% {
        transform: translateX(0px);
    }
    20% {
        transform: translateX(6px);
    }
    30% {
        transform: translateX(0px);
    }
    40% {
        transform: translateX(-3px);
    }
    50% {
        transform: translateX(0px);
    }
    60% {
        transform: translateX(3px);
    }
    70% {
        transform: translateX(0px);
    }
    80% {
        transform: translateX(-3px);
    }
    90% {
        transform: translateX(0px);
    }
    100% {
        transform: translateX(3px);
    }
}

@keyframes img-wrap {
    100% {
        transform: translateY(100%);
    }
}

@keyframes show-mv {
    100% {
        opacity: 1;
    }
}

@keyframes bound {
    80% {
        opacity: 1;
        transform: translateY(15px)
    }
    100% {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes bound2 {
    10% {
        opacity: 1;
        transform: translateY(0)
    }
    20% {
        opacity: 1;
        transform: translateY(50px)
    }
    25% {
        opacity: 1;
        transform: translateY(0)
    }
    35% {
        opacity: 1;
        transform: translateY(30px)
    }
    40% {
        opacity: 1;
        transform: translateY(0)
    }
    45% {
        opacity: 1;
        transform: translateY(5px)
    }
    50% {
        opacity: 1;
        transform: translateY(0)
    }
    100% {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes img-wrap {
    100% {
        height: 10px;
    }
}

@keyframes saurus-mv {
    0% {
        opacity: 1;
    }
    70% {
        opacity: 1;
    }
    100% {
        opacity: 1;
        transform: translateY(-30px) translateX(-20px)
    }
}

@media only screen and (max-width: 768px) {
    .hero .scene5 {
        left: -80px;
        width: calc(100% + 80px);
    }
}


/* -------- TOP animation END */

.hero .scroll {
    position: absolute;
    top: auto;
    left: auto;
    bottom: 2rem;
    right: 5%;
    width: 8rem;
    height: 8rem;
    z-index: 99;
}

.hero .scroll img {
    border-radius: 10rem;
    border: 0.2rem solid #fff;
    padding: 0.5rem;
    background: #000;
}

.hero {
    margin-bottom: 60px;
}

.main img {
    width: 100%;
}

.main .note {
    font-size: 1.3rem;
}

.uk-h1,
.uk-h2,
.uk-h3,
.uk-h4,
.uk-h5,
.uk-h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #fff;
}

.sec-top {
    padding-top: 11rem;
    padding-bottom: 3rem;
    overflow: hidden;
}

.sec-top h2 {
    margin-bottom: 7rem;
    display: inline-block;
    position: relative;
}

.sec-top h2 img.tit {
    max-width: 390px;
}

.sec-top h2 img.moon {
    position: absolute;
    top: -9rem;
    left: -9rem;
    width: 88px;
}

.sec-top img.copy {
    max-width: 380px;
    margin-bottom: 7rem;
    position: relative;
    z-index: 2;
}

.sec-top .sec-top-copy {
    position: relative;
}

.sec-top img.bg-img {
    position: absolute;
    z-index: 1;
    bottom: 0;
}

.sec-top img.yoho {
    left: 3rem;
    max-width: 389px;
}

.sec-top img.kazan {
    right: 0;
    max-width: 456px;
}

.sec-lineup {
    overflow: hidden;
}

.sec-lineup .lineup-header {
    padding: 9rem 1rem;
    background: url('../img/bg-ale.jpg') center center / cover no-repeat;
    margin-top: 10rem;
    margin-bottom: 13rem;
}

.sec-lineup .lineup-header h2 {
    margin-top: 1rem;
}

.sec-lineup .lineup-header h2 img {
    max-width: 470px;
}

.sec-lineup .lineup-header p {
    display: inline-block;
    font-size: 2.4rem;
    border: 0.2rem solid #fff;
    padding: 0.8rem 2rem;
    margin: 1rem 0 1rem;
}

.sec-lineup article>div {
    margin-bottom: 14rem;
}

.sec-lineup .lineup {
    padding-left: 6rem;
    padding-right: 6rem;
    padding-bottom: 6rem;
    position: relative;
}

.sec-lineup .lineup-red {
    border: 2px solid #A90A1B;
}

.sec-lineup .lineup-green {
    border: 2px solid #026630;
}

.sec-lineup .lineup-blue {
    border: 2px solid #6196B5;
}

.lineup-orange {
    border: 2px solid #E0A040;
}

.sec-lineup .copy {
    position: absolute;
    z-index: 2;
    top: 3rem;
    left: -3rem;
    font-size: 2.4rem;
    padding: 1rem 6rem;
    margin: 0;
    background: #000;
}

.sec-lineup .lineup-red .copy {
    border: 2px solid #A90A1B;
}

.sec-lineup .lineup-green .copy {
    border: 2px solid #026630;
}

.sec-lineup .lineup-blue .copy {
    border: 2px solid #6196B5;
}

.lineup-orange .copy {
    border: 2px solid #E0A040;
}

.sec-lineup h3 {
    text-align: center;
    margin-top: 14rem;
    margin-bottom: 4rem;
}

.sec-lineup h3 img {
    max-width: 310px;
}

.sec-lineup img.saurus {
    position: absolute;
    z-index: 1;
    top: -8rem;
    right: -3rem;
    max-width: 390px;
}

.sec-lineup img.coming {
    max-width: 320px;
    position: absolute;
    top: 1rem;
    right: 1rem;
}

.sec-lineup p.txt {
    margin-bottom: 4rem;
}

.sec-lineup .lineup-coming .item-info {
    margin-top: 16rem;
}

.sec-lineup .lineup-coming .item-info img {
    max-width: 360px;
}

.sec-story h2 {
    text-align: center;
    padding-top: 5rem;
    margin-bottom: 6rem;
}

.sec-story h2 img {
    max-width: 378px;
}

.story-header {
    position: relative;
}

.story-header>div {
    height: 15rem;
    padding: 6rem;
}

.story-header:before,
.sec-story .uk-open>.uk-accordion-title::before {
    background: rgba(0, 0, 0, 0.4);
    position: absolute;
    top: 0;
    right: 0;
    content: ' ';
    width: 100%;
    height: 100%;
    transition: all 0.3s ease 0s;
}

.story-header:hover:before,
.sec-story .uk-open>.uk-accordion-title:hover::before {
    background: rgba(0, 0, 0, 0.3);
}

.sec-story ul li {
    margin-bottom: 8rem;
}

#story1 .story-header {
    background: url('../img/bg-md01.jpg') center center / cover no-repeat;
}

#story2 .story-header {
    background: url('../img/bg-md02.jpg') center center / cover no-repeat;
}

#story3 .story-header {
    background: url('../img/bg-md03.jpg') center center / cover no-repeat;
}

#story4 .story-header {
    background: url('../img/bg-md04.jpg') center center / cover no-repeat;
}

#story5 .story-header {
    background: url('../img/bg-md05.jpg') center center / cover no-repeat;
}

.story-header>* {
    position: relative;
    z-index: 2;
}

.story-header img.no {
    max-width: 90px;
    margin-right: 4rem;
}

.story-header h3 {
    margin: 0 1rem 0 0;
    font-size: 3.2rem;
    font-weight: bold;
}

.sec-story li .story-header .acco-btn {
    width: 8rem;
    height: 8rem;
    margin-left: auto;
    background: url('../img/btn-open.png') center center / cover no-repeat;
}

.sec-story li.uk-open .story-header .acco-btn {
    background: url('../img/btn-close.png') center center / cover no-repeat;
}

.story-content {
    background: #fff;
    color: #333;
    padding: 4rem 6rem 6rem;
    margin-top: 0;
}

.story-content h4 {
    color: #333;
    font-size: 2rem;
    font-weight: bold;
}

.story-content p {
    margin-bottom: 2rem;
}

.sec-reading  {
	width:100%;
	overflow:hidden;
}

.sec-reading h3 {
    font-size: 2.4rem;
    font-weight: 600;
    margin-top: 6rem;
}
.sec-reading .txt {
	width:100%;
}
.sec-reading .saurus {
	margin-left:-15%;
	width:28%;
	padding-right:2%;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	-o-box-sizing: content-box;
	-ms-box-sizing: content-box;
	box-sizing : content-box;
}
.sec-reading .kazan {
	margin-right:-15%;
	width:30%;
}
.sec-reading .link-btn a {
    display: inline-block;
    font-size: 2.4rem;
    font-weight: 600;
    padding: 5rem 0;
    width: 100%;
    max-width: 670px;
    background: #D2D9E3;
    color: #000;
    margin-top: 1.5rem;
    border-radius: 7rem;
    text-align: center;
    transition: all 0.3s ease 0s;
}

.sec-reading .link-btn a:hover {
    text-decoration: none;
    background: #e4e8ee;
}

.sec-instagram {
	background-color:#3E3737;
    padding-top: 6rem;
    padding-bottom: 6rem;
}
.sec-instagram h2 img {
    max-width: 378px;
}
.sec-instagram h3 {
    font-size: 2.4rem;
    font-weight: 600;
    margin-top: 3rem;
    margin-bottom: 3rem;
}

.sec-instagram .img {
	width:32%;
	margin-bottom:0.5%;
}


.sec-info {
    padding-top: 6rem;
    padding-bottom: 6rem;
}

.info-box {
    margin-top: 4rem;
    border: 2px solid #fff;
    padding: 4rem 6rem 7.5rem;
}

.info-box h2 {
    margin-top: -8rem;
    text-align: center;
}

.info-box h2 span {
    display: inline-block;
    background: #000;
    padding: 0 3rem;
}

.info-box h3 {
    font-size: 2.4rem;
    font-weight: 600;
    margin-top: 6rem;
}

.info-box p.txt a {
    color: #fff;
    text-decoration: underline;
}

.info-box p.txt a:hover {
    text-decoration: none;
}

.info-box .link-btn a {
    display: inline-block;
    font-size: 2.4rem;
    font-weight: 600;
    padding: 5rem 0;
    width: 100%;
    max-width: 670px;
    background: #D2D9E3;
    color: #000;
    margin-top: 1.5rem;
    border-radius: 15rem;
    text-align: center;
    transition: all 0.3s ease 0s;
}

.info-box .link-btn a.btn-contact {
    background: #fff;
    max-width: 440px;
}

.info-box .link-btn a:hover {
    text-decoration: none;
    background: #e4e8ee;
}

.info-box .link-btn a:not(:last-child) {
    margin-bottom: 3rem;
}

.info-box img.icon {
    width: 50px;
    margin-right: 0.5rem;
    transform: translateY(-3px);
}

.sec-sns  {
	overflow:hidden;
}

.sec-sns .facebook {
}
.sec-sns .twitter {
}
.sec-sns h2 img {
    max-width: 203px;
}

.sec-sns .uk-grid {
	margin-right:auto;
	margin-left:auto;
}

.sec-shop h2 img {
    max-width: 487px;
}

/*
.sec-sns h2 img {
    max-width: 140px;
}
*/

.sec-contact h2 img {
    max-width: 316px;
}

footer {
    font-size: 1.3rem;
    text-align: center;
    border-top: 1px solid #fff;
    padding: 3rem 1.5rem 1rem;
    margin-top: 6rem;
}
footer a {
	color:#FFF;
	text-decoration:underline;
}

@media only screen and (max-width: 970px) {
    .sec-top img.yoho {
        left: -30%;
    }
    .sec-top img.kazan {
        right: -20%;
    }
    .sec-lineup img.saurus {
        right: -3rem;
        max-width: 280px;
    }
}

@media only screen and (max-width: 630px) {
    body {
        font-size: 1.4rem;
        line-height: 2.4rem;
    }
    .uk-navbar {
        top: -1rem;
        left: 0rem;
    }
    .uk-navbar a.uk-icon svg {
        width: 3rem;
    }
    .hero .scroll {
        width: 6rem;
        height: 6rem;
        right: 1rem;
        bottom: 1rem;
    }
    .hero .scene6 {
        background-image: url(../img/mv-title1-sp.png);
        background-position: top right;
        background-size: 40%;
        left: auto;
        right: 0;
        top: 10px;
    }
    .hero .scene7 {
        background-image: url(../img/mv-title2-sp.png);
        background-position: top right;
        background-size: 40%;
        left: auto;
        right: 0;
        top: 10px;
    }
    .sec-top {
        padding-top: 4rem;
    }
    .sec-top h2 {
        margin: 3rem;
    }
    .sec-top h2 img.tit {
        max-width: 220px;
    }
    .sec-top h2 img.moon {
        max-width: 46px;
        left: -5rem;
        top: -4rem;
    }
    .sec-top img.copy {
        max-width: 260px;
        margin-bottom: 4rem;
    }
    .sec-top img.yoho {
        max-width: 260px;
        left: -30%;
    }
    .sec-top img.kazan {
        max-width: 235px;
        right: -25%;
    }
    .sec-lineup .lineup {
        padding-left: 2rem;
        padding-right: 2rem;
        padding-bottom: 2rem;
    }
    .sec-lineup .lineup-header {
        margin-top: 3rem;
        margin-bottom: 6rem;
        padding-top: 4rem;
        padding-bottom: 2rem;
        background: url('../img/bg-ale-sp.jpg') center center / cover no-repeat;
    }
    .sec-lineup .lineup-header h2 img {
        max-width: 154px;
    }
    .sec-lineup .lineup-header p {
        padding: 0.3rem 1.5rem;
        font-size: 1.6rem;
        margin-bottom: 0;
    }
    .sec-lineup article>div {
        padding-bottom: 3rem;
        margin-bottom: 5.5rem;
    }
    .sec-lineup .copy {
        font-size: 16px;
        padding: 0.6rem 2rem;
        left: -2.5rem;
    }
    .sec-lineup h3 {
        margin-top: 10rem;
        margin-bottom: 3rem;
    }
    .sec-lineup h3 img {
        max-width: 165px;
    }
    .sec-lineup img.saurus {
        max-width: 195px;
        top: -4rem;
        right: -3.5rem;
    }
    .sec-lineup img.coming {
        max-width: 160px;
        top: 1rem;
        right: 0.5rem;
        z-index: 4;
    }
    .sec-lineup p.txt {
        margin-bottom: 3rem;
    }
    .sec-lineup .item-info img {
        max-width: 240px;
    }
    .sec-lineup .lineup-coming .item-info {
        margin-top: 8rem;
    }
    .sec-lineup .lineup-coming .item-info img {
        max-width: 212px;
    }
    .sec-story h2 {
        padding-top: 0rem;
        margin-bottom: 3rem;
    }
    .sec-story h2 img {
        max-width: 216px;
    }
    .story-header>div {
        height: 6rem;
        padding: 1.6rem;
    }
    .story-header img.no {
        max-width: 45px;
        margin-right: 2rem;
    }
    .story-header h3 {
        font-size: 1.8rem;
    }
    .sec-story li .story-header .acco-btn {
        width: 4rem;
        height: 4rem;
    }
    .sec-story ul li {
        margin-bottom: 3rem;
    }
    .story-header .acco-btn {
        width: 4rem;
        height: 4rem;
    }
    .story-content {
        padding: 2rem;
    }
    .story-content h4 {
        font-size: 1.5rem;
        margin-bottom: 1rem;
    }
    .story-content p {
        margin-top: 1rem;
        margin-bottom: 1rem;
    }
    
     .sec-reading h3 {
        font-size: 1.5rem;
        margin-top: 2.5rem;
    }
	.sec-reading .saurus {
		margin-left:-20%;
		width:38%;
		padding-right:2%;
	}
	.sec-reading .kazan {
		margin-right:-20%;
		width:40%;
	}
	.sec-reading .link-btn a {
        font-size: 1.5rem;
        padding: 2rem 0;
        border-radius: 10rem;
        margin-top: 0rem;
	}
	
	.sec-instagram h2 img {
		max-width: 235px;
	}
     .sec-instagram h3 {
        font-size: 1.5rem;
        margin-top: 2.5rem;
    }
	
	.sec-sns .facebook {
		width:90%;
		margin-left:auto;
		margin-right:auto;
	}
	.sec-sns .twitter {
		width:90%;
		margin-left:auto;
		margin-right:auto;
	}
	.sec-sns  .uk-grid>* {
	    padding-left: 0;
    }
	.sec-sns h2 img {
	    max-width: 203px;
	}
	
    .sec-info {
        padding-top: 3rem;
        padding-bottom: 0rem;
    }
    .info-box {
        padding: 2rem 2rem 3rem;
        margin-bottom: 6rem;
    }
    .info-box h2 {
        margin-top: -4.5rem;
    }
    .info-box h2 span {
        padding: 0 1rem;
    }
    .info-box h3 {
        font-size: 1.5rem;
        margin-top: 2.5rem;
    }
    .info-box .link-btn a {
        font-size: 1.5rem;
        padding: 2rem 0;
        border-radius: 6rem;
        margin-top: 0rem;
    }
    .info-box .link-btn a.btn-contact {
        max-width: 220px;
    }
    .info-box .link-btn a:not(:last-child) {
        margin-bottom: 2rem;
    }
    .info-box img.icon {
        width: 30px;
        margin-right: 0.5rem;
        transform: translateY(-3px);
    }
    .sec-shop h2 {
        margin-top: -6rem;
    }
    .sec-shop h2 img {
        max-width: 138px;
    }
    .sec-sns h2 img {
        max-width: 208px;
    }
/*    .sec-sns h2 img {
        max-width: 78px;
    }
*/
    .sec-contact h2 img {
        max-width: 180px;
    }
}

@media only screen and (max-width: 380px) {
    .sec-top img.yoho {
        left: -50%;
    }
}

@media only screen and (max-width: 350px) {
    .sec-top img.yoho {
        left: -60%;
    }
    .sec-lineup .lineup,
    .story-content,
    .info-box {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    .sec-lineup .copy {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .sec-lineup img.saurus {
        max-width: 180px;
        right: -4rem;
    }
    .sec-lineup img.coming {
        max-width: 140px;
    }
    .story-header>div {
        padding: 2rem;
    }
    .story-header .acco-btn {
        width: 3rem;
        height: 3rem;
    }
    .story-header img.no {
        margin-right: 1rem;
    }
}