@charset "UTF-8";


.ec-layoutRole .ec-layoutRole__contents{
	max-width: 1600px;
}
.ec-searchnavRole {
    max-width: 1600px;
    padding-left: 0px;
    padding-right: 0px;
}

.ec-layoutRole {
    margin-top: 40px !important;
}

#topInfo p.free{
	display: none;
}
#campaign_gas, #campaign_gas p {
    font-family: m-plus-2p, sans-serif !important;
}

#campaign_gas p.intro{
    background: #e5dcd3;
    display: inline-block;
    font-size:28px;
    letter-spacing: 0.05em;
    padding:4px 46px;
    border-radius:30px;
    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.20);
    color:#13294b;
    margin: 20px 0 0 10%;
    font-family: poppins !important;
}

#campaign_gas #txtArea{
    max-width:1200px;
    margin: 10px auto;
    position: relative;
}

#campaign_gas .sec01{
    position: relative;
}
/*
#campaign_gas .sec01 ul li:nth-child(1) a{
    width:23%;
    display: block;
    height:10%;
    position: absolute;
    bottom:10%;
    left:6%;
}

#campaign_gas .sec01 ul li:nth-child(2) a{
    width:23%;
    display: block;
    height:10%;
    position: absolute;
    bottom:10%;
    left:40%;
}
*/
#campaign_gas .sec01 ul li:nth-child(1) a{
    width: 32%;
    display: block;
    height: 8%;
    position: absolute;
    bottom: 2%;
    left: 3%;
}

/*

#campaign_gas .sec02 ul li:nth-child(1) a{
    width:23%;
    display: block;
    height:10%;
    position: absolute;
    bottom:3%;
    left:12%;
}

#campaign_gas .sec02 ul li:nth-child(2) a{
    width:23%;
    display: block;
    height:10%;
    position: absolute;
    bottom:3%;
    left:46%;
}
*/

#campaign_gas #txtArea p{
    text-align: left;
    color:#13294b;
    line-height:1.8em;
    font-size:28px;
}
#campaign_gas #txtArea p span{
    font-weight: 500;
}

#campaign_gas #txtArea p{
    margin: 60px 0px;
}

#campaign_gas #txtArea p.catch01{
    margin: 10px 0px;
    font-weight: 600;
    font-family:poppins !important;
    border-bottom:2px solid #13294b;
    font-size:50px;
    text-align: center;
    display: inline-block;
    margin: 0 auto 20px;
    line-height: 1;
}

#campaign_gas #txtArea p.catch02{
    margin: 10px 0px;
    font-size:38px;
    font-weight: bold;
    text-shadow: 2px 3px 3px rgba(0, 0, 0, 0.2);
    text-align: center;
}


#campaign_gas #txtArea .txt.tacenter{
    text-align: center;
}


.flex{
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    margin: 100px auto 80px;
}


.flex .flexBox{
    flex-basis:30%;
    display: inline-flex;
}

p.txtLink a{
    display: block;
    text-align: center;
    color: #005d6e;
    font-size: 40px;
    font-weight: bold;
    margin-bottom: 100px;
    text-decoration: none;
    transition: 0.5s;
}


p.txtLink a:hover{
    opacity: 0.7;
}


#campaign_gas #main-content .simpleBtn a {
    color: #fff;
    width: 540px;
    height: 150px;
    text-align: center;
    margin: 0 auto;
    display: block;
    border-radius: 200px;
    padding-top: 40px;
    font-size: 30px;
    position: relative;
    line-height: normal;
}

#campaign_gas #main-content .simpleBtn a img{
    display: block;
    margin: 0 auto;
    text-align: center;
}

#campaign_gas #main-content .simpleBtn.color02 a{
    background-color: #75A7AD;
}


#campaign_gas #main-content .simpleBtn a:after{
    content:"";
    position: absolute;
    bottom:22px;
    left:50%;
    margin-left:-18px;
    width: 0;
    height: 0;
    border-style: solid;
    border-right: 24px solid transparent;
    border-left: 24px solid transparent;
    border-top: 32px solid #ffffff;
    border-bottom: 0;
}

#campaign_gas #main-content .simpleBtn.color02 a:hover{
    background:#002238;
}


@media screen and (max-width:768px){

    
    #main-content {
        padding: 0px 0 0px !important;
    }

    .ec-layoutRole {
        margin-top: -20px !important;
    }

    h1 img,
    #campaign_gas #txtArea .txt img,
    #footImg img,
    ul.flex li img{
        width: 100% !important;
        height: auto !important;
    }

    
    #campaign_gas #txtArea {
        margin: 10px auto;
        padding: 0 20px;
    }
    #campaign_gas #main-content img{
        width: 100%;
        height: auto;
    }


    #campaign_gas #txtArea .txt.tacenter{
        text-align: left;
    }
    #campaign_gas #txtArea p.catch01 {
        margin: 10px 0px;
        font-size: 4.9vw;
        text-align: center;
        display:block;
        margin: 0 auto 10px;
    }
    #campaign_gas #txtArea p.catch02 {
        margin: 0px 0px 10;
        font-size: 4vw;
        text-align: center;
    }

    #campaign_gas #txtArea p {
        margin: 0px 0px 20px;
    }



    .flex{
        max-width: 1200px;
        display: block;
        justify-content: space-between;
        margin: 40px auto 40px;
    }
    
    
    .flex .flexBox{
        flex-basis:100%;
        display: block;
    }
    

    #campaign_gas #main-content .simpleBtn a {
        color: #fff;
        width: 80%;
        height: auto;
        text-align: center;
        margin: 0 auto;
        display: block;
        padding: 20px 0 40px;
        border-radius: 200px;
        font-size: 20px;
        line-height: normal;
        position: relative;
    }


    #campaign_gas #main-content .simpleBtn a:after{
        content:"";
        position: absolute;
        bottom:16px;
        left:50%;
        margin-left:-9px;
        width: 0;
        height: 0;
        border-style: solid;
        border-right: 12px solid transparent;
        border-left: 12px solid transparent;
        border-top: 16px solid #ffffff;
        border-bottom: 0;
    }
    
/*
    #campaign_gas .sec01 ul li:nth-child(1) a{
        width:23%;
        display: block;
        height:10%;
        position: absolute;
        bottom:10%;
        left:10%;
    }
    
    #campaign_gas .sec01 ul li:nth-child(2) a{
        width:23%;
        display: block;
        height:10%;
        position: absolute;
        bottom:10%;
        left:40%;
    }
    */
    #campaign_gas .sec01 ul li:nth-child(1) a{
        width:50%;
        display: block;
        height:8%;
        position: absolute;
        bottom:1%;
        left:10%;
    }
    
    
    /*
    #campaign_gas .sec02 ul li:nth-child(1) a{
        width:23%;
        display: block;
        height:10%;
        position: absolute;
        bottom:4%;
        left:14%;
    }
    
    #campaign_gas .sec02 ul li:nth-child(2) a{
        width:23%;
        display: block;
        height:10%;
        position: absolute;
        bottom:4%;
        left:48%;
    }*/

    #campaign_gas #main-content .simpleBtn img{
        width: auto !important;
        height: 30px !important;
    }

    .lity-image img {
        max-width: 96% !important;
        text-align: center;
        margin: 0 auto;
    }


}






