:root {
    --font-blue-color: #062f81;    
    --font-black-color: #1e1e1e;
}

#sect01{
    padding-top: 100px;
    background-color: #edf2f7;
    padding-bottom: 100px;
}
    #sect01 h1{
        margin-bottom: 16px;
        font-size: 28px;       
        color: var(--font-blue-color);
        text-align: center;
    }
        #sect01 h1 .black{
            color: var(--font-black-color);
        }

    #sect01 .note{
        font-size: 20px; 
        margin-bottom: 40px;
        color: #000;
        text-align: center;
    }    
    @media screen and (max-width:768px) {
        #sect01{
            padding-top: 50px;
            padding-bottom: 50px;
        }
        #sect01 h1{
            font-size: 24px;       
        }
        #sect01 .note{
            font-size: 16px; 
            margin-bottom: 30px;
        }    
    }

    /* Progress bar container */
    .progress {    
        position: relative;
        height: 15px;
        margin-bottom: 20px;
        width: 100%;
        margin: 0px auto 20px auto;
    }
    .progress-container {
        width: calc(100% - 100px);
        overflow: hidden;
        height: 100%;
        position: relative;
        border: 1px solid #062f81;
    }
    .progress-bar {
        height: 100%;
        background-color: #062f81;
        transition: width 0.4s ease;    
    }

    .progress-label {
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        font-weight: bold;
        width: 100px;
        text-align: right;
        color: #062f81 ;
        font-size: 22px;
    }

    #sect01 .step-app > .step-steps {
        display: none;

    }
    .step-app > .step-content {
        border: none;
        padding: 0px;
        border-top: 0;
    }    
    #sect01 .step-app .step-footer{    
        display: flex;
        align-items: center;    
        margin-top: 20px;
    }

    #sect01 .qa_part {
        background-color: #fefeff;
        padding: 35px 38px;
        border-radius: 9px;
        width: 100%;
        margin: 0 auto;
		text-align: center;
    }
        #sect01 .qa_part #qa_part_2,
        #sect01 .qa_part #qa_part_3
        {
            margin-bottom: 0.31vw;
        }        
        #sect01 .qa_part .title {
            color: var(--font-black-color);
            font-size: 22px;
            font-weight: bold;
			text-align:center;
        }
        #sect01 .qa_part .ans_sel{
            display: flex;
            width: fit-content;
            margin-top: 20px;
        }
            #sect01 .qa_part .yes,
            #sect01 .qa_part .no{
                width: 254px;
                max-width: 100%;
                height: 155px;
                background-color: #fafafa;
                border: 1px solid #c8c8c8;
                border-radius: 5px;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center; 
                cursor: pointer;               
            }

            @media screen and (max-width:768px) {
                #sect01 .qa_part .yes,
                #sect01 .qa_part .no{
                    width: 35vw;
                    height: auto;
                    padding: 5px;
                }
            }

            input[type="radio"]:checked + label {
                -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color=#768FC2)";/*IE 8*/
                -moz-box-shadow: 1px 1px 4px 4px #768FC2;/*FF 3.5+*/
                -webkit-box-shadow: 1px 1px 4px 4px #768FC2;/*Saf3-4, Chrome, iOS 4.0.2-4.2, Android 2.3+*/
                box-shadow: 1px 1px 4px 4px #768FC2;/* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
                filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color=#768FC2); /*IE 5.5-7*/
            }

            #sect01 .qa_part .ans_sel > label{
                margin-right: 28px;
            }
                #sect01 .qa_part .ans_sel img{
                    margin-bottom: 16px;
                }
                #sect01 .qa_part .ans_sel .label{
                    font-size: 16px;
                    font-weight: 500;
                }
                #sect01 .qa_part .ans_sel >div:last-child{
                    margin-right: 0;
                }
                #sect01 .qa_part input[type="radio"]{
                    display: none;
                }
        #sect01 .qa_part .input_cols{
            display: flex;
            flex-wrap: wrap;
        }        
        #sect01 .qa_part .sel_men_cnt{
            width: calc( (100% - 60px ) / 3 );
            margin-right: 30px;
            margin-top: 20px;
            background-color:#fff;
            color: #282828;
            border: 1px solid #b3b1b1;
            border-radius: 5px;
            text-align: left;
            padding: 10px;
            font-size: 18px;
            font-weight: bold;
            cursor: pointer;      
        }
        #sect01 .qa_part .sel_men_cnt:nth-child(3n){
            margin-right: 0px;
        }
        @media screen and (max-width:768px) {
            #sect01 .qa_part .sel_men_cnt{
                width: fit-content;
                padding: 10px 20px;
                margin-right: 15px;
                margin-top: 15px;
            }
            #sect01 .qa_part .sel_men_cnt:nth-child(3n){
                margin-right: 15px;
            }
        }
        #sect01 .qa_part .go_step{
            width: 40px;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 18px;
            font-weight: bold;
            border-radius: 5px;
            border: 1px solid #b3b1b1;
            margin-right: 10px;
            cursor: pointer;
            color: #282828;
        }

        #sect01 .qa_part#qa_part_4 .input_cols{
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        #sect01 .qa_part#qa_part_4 .title{
            font-size: 22px;
            margin-bottom: 30px;
            text-align: center;
        }
        #sect01 .qa_part#qa_part_4 .note{
            font-size: 18px;
            margin-bottom: 30px;
            text-align: center;
            color: #9b9b9b;
        }

        @media screen and (max-width:768px) {
            #sect01 .qa_part#qa_part_4 .note br{
                display: none;
            }

        }

        #sect01 .qa_part#qa_part_4 .google_link{
            width: 400px;
            max-width: 100%;
            height: 50px;
            max-width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 20px;           
            font-weight: bold;
            border: 1px solid #b3b1b1;
            border-radius: 5px;
            margin: 0 auto 30px auto;
            position: relative;
            color: #5c5b5b;
        }
            #sect01 .qa_part#qa_part_4 .google_link .google_icon{
                position: absolute;
                left: 50px;
                top: 15px;
            }
        #sect01 .qa_part#qa_part_4 .email_input{
            position: relative;
        }
        #sect01 .qa_part#qa_part_4 .email_box{
            width: 550px;
            max-width: 100%;
            height: 60px;
            border-radius: 5px;
            border: 1px solid #b3b1b1;
            position: relative;
            font-size: 20px;
            margin-bottom: 2.50vw;
            padding: 5px 20px;
            outline: none;
        }
        @media screen and (max-width:768px) {
            #sect01 .qa_part#qa_part_4 .email_box{
                width: 100%;
            }
        }
        #sect01 .qa_part#qa_part_4 .email_input .label{
            position: absolute;
            left: 15px;
            top: -12px;
            color: #9b9b9b;
            background-color: white;
            z-index: 1;
            font-size: 18px;
        }
        #sect01 .qa_part#qa_part_4 .reg_mail_addr{
            width: 460px;
            max-width: 100%;
            height: 70px;
            border-radius: 35px;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 24px;
            background-color: #1b74e2;
            color: white;
            margin-bottom: 15px;
            position: relative;
        }  
        #sect01 .qa_part#qa_part_4 .reg_mail_addr::after{
            position: absolute;
            content: '';
            width: 7px;
            height: 16px;
            background: url('../img/big-white-arrow-right.png');
            right: 50px;
            top: 28px;
        }
        #sect01 .qa_part#qa_part_4 .reg_mail_addr:hover{
            opacity: 1;
            transform: translateY(-5px);
            transition: transform 250ms cubic-bezier(.3, .7, .4, 1.5);
        }
        @media screen and (max-width:768px) {
            #sect01 .qa_part#qa_part_4 .reg_mail_addr{
                height: 60px;
                font-size: 20px;
            }
            #sect01 .qa_part#qa_part_4 .reg_mail_addr::after{
                display: none;
            }
        }