@charset "shift_jis";

/* main-inner */

#main #main-inner {
    border: none;
    background: url('../img/bg_ptrn.gif') repeat left top;
    margin-top: 10px;
}
#main #main-title {
    height: 720px;
    background: url('../img/top_bg.png') left top no-repeat;
    top: -45px;
    z-index: 3;
}
#main #main-title h2 {
    top: 55px;
    left: -50px;
    z-index: 2;
    width: 664px;
}
#main #main-title .topimg {
    bottom: 5px;
    right: -30px;
    z-index: 1;
}
#main #main-title .catch {
    top: 60px;
    right: 25px;
    z-index: 1;
}

#cont-wrap {
    position: relative;
    margin-top: -35px;
    text-align: center;
    padding-bottom: 40px;
}
#main #sec01 {
}
#main #cont-wrap #sec01 .sec01head {
    position: relative;
    top: 0px;
    left: 10px;
    z-index: 0;
}
#main #cont-wrap #sec01 h2.sec01ttl01 {
    margin-top: -87px;
    position: relative;
    z-index: 1;
}
#main #cont-wrap #sec01 .sec01txt01 {
    margin-top: 20px;
}
#main #cont-wrap #sec01 .sec01txt02 {
    margin-top: 20px;
}
#main #cont-wrap #sec01 .sec01img01 {
    margin-top: 20px;
}
#main #cont-wrap #sec01 .sec01img02 {
    margin-top: 20px;
}
#main #cont-wrap #sec01 .sec01img03 {
    margin-top: 20px;
}
#main #cont-wrap #sec01 .sec01txt03 {
    margin-top: 20px;
}
#main #cont-wrap #sec01 .sec01txt07 {
    margin-top: 10px;
}
#main #cont-wrap #sec01 .sec01box01 {
    background: url('../img/sec01_sub_bg.png') no-repeat center top;
    width: 804px;
    height: 620px;
    margin: 20px auto 0;
    padding: 20px 0;
    box-sizing: border-box;
}
#main #cont-wrap #sec01 .sec01box01 .sec01txt04 {
    margin-top: 10px;
}
#main #cont-wrap #sec01 .sec01box02 {
    background-color: #fee89c;
    border-radius: 15px;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 10px 10px 20px;
    width: 744px;
    margin: 15px auto 0;
}
#main #cont-wrap #sec01 .sec01box03 {
    margin-top: 30px;
}

#main #cont-wrap #sec02 h2.sec02ttl01 {
    margin-top: 60px;
}
#main #cont-wrap #sec02 .sec02txt01 {
    margin-top: 10px;
}
#main #cont-wrap #sec02 .sec02box01 {
    background: url('../img/sec02_sub_bg.png') no-repeat center top;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: flex-end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
            justify-content: space-around;
    width: 808px;
    height: 306px;
    margin: 20px auto 0;
    padding: 0 20px 20px;
    box-sizing: border-box;
}
#main #cont-wrap #sec02 .sec02txt03 {
    margin-top: 10px;
    position: relative;
    top: 0px;
    left: 5px;
    z-index: 0;
}

#main #main-title,
#main #sec01,
#main #sec02 {
    position: relative;
    width: 864px;
}

#main #main-title h2,
#main #main-title p/*,
#main #sec01 h2,
#main #sec01 h3,
#main #sec01 p,
#main #sec02 h2,
#main #sec02 h3,
#main #sec02 p*/ {
    position: absolute;
    margin: 0;
    padding: 0;
}


/* main-title */

#main #title-area {
    z-index: 10;
    height: 35px;
}
#main #title-area h1 {
    position: absolute;
    top: 12px;
    left: 13px;
}


/* main-footer */

.main-footer {
    position: relative;
    margin: 20px 0 0;
    padding-bottom: 32px;
}

.f-border {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #C1C1C1;
}

.main-footer .f-hard {
    position: absolute;
    top: 0;
    right: 0;
}

.f-border .f-hard {
    top: 20px;
}

.f-wrap {
    margin: 36px 0 0;
}

.main-footer .f-logo {
    float: left;
    width: 320px;
    text-align: center;
}

.main-footer .f-contents {
    float: right;
    width: 514px;
}

.main-footer .f-icon {
    float: left;
}

.main-footer .f-name {
    position: relative;
    float: right;
    width: 443px;
    height: 55px;
}

.main-footer .f-soft-ttl {
    position: absolute;
    top: 10px;
}

.main-footer .f-copyright {
    position: absolute;
    bottom: 10px;
    color: #FFFFFF;
    font-size: 9px;
}

.main-footer .f-note01 {
    margin: 5px 0 15px;
    color: #FFFFFF;
    font-size: 9px;
}

.main-footer .f-btn {
    margin: 15px 0 0;
}


/* clearfix */

.clearfix::after {
    content: '';
    display: block;
    clear: both;
}