@charset "utf-8";

/* MV
----------------------------------------------------------------------------- */
.mv{
    background-image: url("../images/story_mv.png");
}

@media screen and (max-width:768px){
    .mv-inner-box.mv-inner-box-lb{
		width: 50%;
	}
}

/* INTRO
----------------------------------------------------------------------------- */
.story-intro{
    padding: 100px 0 50px;
}
.story-intro .col{
    margin-bottom: 50px;
}

.story-intro-img img{
    width: 100%;
    border-radius: 20px;
}
.story-intro-txt{
    
    padding-left: 50px;
}
.story-intro-txt p{
    font-size: 25px;
    font-weight: 600;
}
.story-intro-txt p span{
    display: block;
    font-size: 20px;
    font-weight: 400;
    margin-top: 20px;
}

.story-intro-detail p{
    width:80vw;
    margin: 0 auto;
    text-align: left;
}

@media screen and (max-width:768px){
	.story-intro{
		padding: 40px 0 50px;
	}
    .story-intro-txt p{
		font-size: 18px;
		margin-top: 30px;
    }
    .story-intro-txt p span{
        font-size: 15px;
    }
	.story-intro-detail p{
		margin: 0;
	}
}

/* MAIN
----------------------------------------------------------------------------- */
.story-main{
    padding: 50px 0;
}

.story-main-01{
    margin-bottom: 50px;
}
.story-main-01 .story-main-txt{
    padding-right: 50px;
}

.story-main-02{
    margin-bottom: 50px;
}
.story-main-02 .story-main-txt{
    padding-left: 50px;
}

.story-main-img .box-img{
    height: 335px;
}
.story-main-img .box-img img{
    width: 100%;
    height: auto;
}

@media screen and (max-width:768px){
    
    .story-main-img .box-img{
        height: 200px;
    }
}