@charset "utf-8";

@media screen and (max-width: 750px) {
    /* flex解除 横幅100% */
    .solution-wrap,
    .feature-wrap,
    .special-wrap,
    .movie-wrap,
    .movie-two-column,
    .flow-wrap,
    .voice-wrap,
    .option-wrap {
        display: flex;
        flex-direction: column;
    }
    .solution-child,
    .feature-child,
    .special-child-img,
    .special-child-txt,
    .movie-wrap div,
    .movie-wrap > div:last-child,
    .movie-child,
    .cta > .secpad,
    .flow-child,
    .voice-child,
    .option-child {
        max-width: 1200px;
        width: 100%;
        margin-bottom: 20px;
    }
}
@media screen and (min-width: 560px) and (max-width: 1200px){
    section {
        padding: 90px 10px;
    }
    #solution .secpad {
        padding: 0 15px;
    }
}

@media screen and (min-width: 560px) and (max-width: 960px) {
    #hero {
        height: 60vh;
    }
}
@media screen and (max-width: 560px) {
    /* ハンバーガー */
    #GlovalNav {
        display: none;
    }
    #nav_toggle {
        display: block;
        width: 45px;
        min-width: 45px;
        height: 35px;
        position: absolute;
        top: 20px;
        right: 15px;
        z-index: 9999;
        transition: .3s;
    }
    .is-scrolled #nav_toggle {
        top: 15px;
    }
    #nav_toggle span {
        display: block;
        position: absolute;
        width: 45px;
        height: 6px;
        left: 50%;
        border-radius: 2px;
        transform: translateX(-50%);
        background: #ffffff;
        transition: .2s;
    }
    #nav_toggle span:nth-child(1) {
        top: 1px;
    }
    #nav_toggle span:nth-child(2) {
        top: 13px;
    }
    #nav_toggle span:nth-child(3) {
        top: 25px;
    }
    .open #nav_toggle span:nth-child(1) {
        top: 13px;
        left: 0;
        transform: rotate(45deg);
    }
    .open #nav_toggle span:nth-child(2) {
        top: 17px;
        opacity: 0;
    }
    .open #nav_toggle span:nth-child(3) {
        top: 13px;
        left: 0;
        transform: rotate(-45deg);
    }
    .open #GlovalNav{
        width: 100%;
        display: block;
        position:fixed;
        top: 60px;
        left: 10;
        right: 0;
        bottom: 0;
        background-color: #ffffff;
    }
    .open #GlovalNav ul {
        display: block;
    }
    .open #GlovalNav ul li{
        width: 100%;
        border-bottom: 1px solid #ccc;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .open #GlovalNav ul li a{
        display: block;
        position: relative;
        width: 100%;
        padding: 25px;
        font-size: 20px;
        color: #152b52;
    }
    .open #GlovalNav ul li a::after{
        position: absolute;
        right: 0;
        padding-right: 30px;
        content: '▶';
    }
    .is-scrolled #nav_toggle span{
        background: #152b52;
    }
	.hero-txt h1{
		font-size: 25px;
	}
	
	.movie-content{
		display: block;
	}
	#movie .secpad > div:last-child{
		padding-left: 0;
	}
    .movie-wrap > div:last-child {
        padding-left: 0;
    }
	.movie-child:not(:nth-child(3n)){
		margin-right: 0;
	}
	.movie-child:nth-child(-n+3){
		margin-bottom: 20px;
	}
    .cta > .secpad > a {
        width: 100%;
    }
    #faq .secpad {
        max-width: 700px;
        width: 100%;
    }
    form,
    .company-data,
    .price-wrap{
        max-width: 600px;
        width: 100%;
    }
    
    /* 全体横幅15px */
    .secpad {
        padding: 0 15px;
    }
    
    /* 文字調整 */
    .cta a::before {
        top: 62px;
        right: 45px;
    }
    
    .sp-br {
        display: inline-block;
    }
    .sp-none {
        display: none;
    }

    /* header調整 */
    header {
        padding: 15px 10px;
    }
    /* hero調整 */
    #hero {
        height: 150vw;
    }

    /* お問い合わせ */
    .tel-txt span{
        font-size: 40px;
    }
    .contact-form {
        max-width: 1200px;
        width: 100%;
        padding: 20px;
    }
    .contact-form dl {
        display: block;
    }
    .contact-form dl dt,
    .contact-form dl dd{
        width: 100%;
    }
    
    /* やじるし */
    .flow-child:not(:last-child) {
        margin-bottom: 55px;
    }
    .flow-child:not(:first-child)::before {
        width: 40px;
        height: 40px;
        top: -45px;
        left: 45%;
        transform: rotate(90deg);
    }
}