@charset "utf-8";
#main {
    width: 100%;
    margin: 10px auto;
    font-size: 16px;
    line-height: 1.5;
    font-family: 'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
    color: #333;
    text-align: center;
}
#main .sp {
    display: none!important;
}
#main a:hover {
    opacity: .7;
}
.wrap {
    width: 1100px;
    margin: 0 auto;
    padding: 30px 0 0;
}
.t_cl01{
    color: #3ecfb6;
}
.t_cl02{
    color: #f2b230;
}
.t_cl03{
    color: #50a7e6;
}
.t_cl04{
    color: #f2798f;
}
.t_cl05{
    color: #6cbf43;
}
.t_cl06{
    color: #d977d9;
}
.container {
    display: flex;
    flex-wrap: wrap;
}
.mv {
    background: url(../images/main_bg.jpg) no-repeat center;
    background-color: #4c9ed7;
    height: 637px;
}
.mv .wrap {
    width: 1000px;
    padding: 30px;
    background-color: #fff;
    position: relative;
    top: 500px;
}
#main .mv h2{
    font-size: 54px;
    font-weight: bold;
    line-height: 1.3;
    letter-spacing: -3px;
}
#main .mv h2 .sub{
    font-size: 36px;
}
#main .mv p{
    font-size: 18px;
    line-height: 2;
    margin-top: 10px;
}
#main .mv img{
    margin-top: 10px;
}
.conts_navi .wrap{
    margin: 240px auto 0;
    padding: 0 0 50px;
}
.conts_navi h3{
    width: auto!important;
    height: auto!important;
    font-size: 40px!important;
    font-weight: bold!important;
    padding: 0!important;
    line-height: 1.4!important;
    text-shadow: none!important;
    letter-spacing: -2px;
}
.conts_navi .btn_area{
    justify-content: space-between;
}
.conts_navi li{
    margin-bottom: 1px;
}
.conts_navi a{
    display: block;
    font-size: 24px;
    line-height: 1.2;
    text-decoration: none;
    width: 366px;
    padding: 30px 0 14px;
}
.conts_navi .btn_01{
    background: url(../images/navi_btn01.jpg) no-repeat center center;
    background-size: cover;
}
.conts_navi .btn_02{
    background: url(../images/navi_btn02.jpg) no-repeat center center;
    background-size: cover;
}
.conts_navi .btn_03{
    background: url(../images/navi_btn03.jpg) no-repeat center center;
    background-size: cover;
}
.conts_navi .btn_04{
    background: url(../images/navi_btn04.jpg) no-repeat center center;
    background-size: cover;
}
.conts_navi .btn_05{
    background: url(../images/navi_btn05.jpg) no-repeat center center;
    background-size: cover;
}
.conts_navi .btn_06{
    background: url(../images/navi_btn06.jpg) no-repeat center center;
    background-size: cover;
}
.conts_navi .btn_01:hover, .conts_navi .btn_02:hover, .conts_navi .btn_03:hover, .conts_navi .btn_04:hover, .conts_navi .btn_05:hover, .conts_navi .btn_06:hover{
    opacity: 0.7;
}
#conts_01 {
    background: url(../images/conts01_bg.jpg);
    background-color: #3ecfb6;
}
#conts_02 {
    background: url(../images/conts02_bg.jpg);
    background-color: #f2b230;
}
#conts_03 {
    background: url(../images/conts03_bg.jpg);
    background-color: #50a7e6;
}
#conts_04 {
    background: url(../images/conts04_bg.jpg);
    background-color: #f2798f;
}
#conts_05 {
    background: url(../images/conts05_bg.jpg);
    background-color: #6cbf43;
}
#conts_06 {
    background: url(../images/conts06_bg.jpg);
    background-color: #d977d9;
}
.txt_area{
    margin-top: -40px;
    padding-bottom: 40px;
    background-color: rgba(255,255,255,0.6);
}
.txt_area .container {
    padding-top: 70px;
}
#conts_01 h3, #conts_02 h3, #conts_03 h3, #conts_04 h3, #conts_05 h3, #conts_06 h3 {
    width: auto!important;
    height: auto!important;
    font-size: 50px!important;
    font-weight: bold!important;
    padding: 50px 0 0!important;
    line-height: 1.4!important;
    text-shadow: none!important;
    letter-spacing: -2px;
    line-height: 1 !important;
}
#conts_01 h3 span, #conts_02 h3 span, #conts_03 h3 span, #conts_04 h3 span, #conts_05 h3 span, #conts_06 h3 span {
    font-size: 100px!important;
    font-weight: bolder!important;
}
#conts_01 .container, #conts_03 .container, #conts_05 .container {
    flex-direction: row-reverse;
}
#conts_01 h4, #conts_02 h4, #conts_03 h4, #conts_04 h4, #conts_05 h4 {
    width: 450px;
    line-height: 1.75;
    font-size: 24px;
    padding-top: 5em;
    background-color: #fff;
}
#conts_04 h4 {
    padding-top: 5.5em;
}
#conts_05 h4 {
    padding-top: 3em;
}
#conts_01 .txt_area .container {
    flex-direction: row;
}
#conts_01 .txt_area .container div{
    width: 45%;
    margin-right: 5%;
    text-align: left;
}
#conts_01 h5, #conts_02 h5, #conts_03 h5, #conts_04 h5, #conts_05 h5 {
    font-size: 22px!important;
    font-weight: bold!important;
}
.txt_area .container div{
    margin: 0 auto;
}
#conts_05 .wrap span{
    font-weight: bold;
    color: #ff4c4c;
}
#conts_05 .guide_btn a{
    display: block;
    color: #fff;
    font-size: 20px;
    line-height: 1.5;
    text-decoration: none;
    padding: 15px 20px;
    background-color: #78bf30;
    margin: 1em 2em;
    border-radius: 2em;
}
#conts_06 p{
    margin-top: 1em;
}
#tour_btn_area h3{
    width: auto!important;
    height: auto!important;
    font-size: 40px!important;
    font-weight: bold!important;
    padding: 0!important;
    line-height: 1.4!important;
    text-shadow: none!important;
    letter-spacing: -2px;
    margin-top: 0;
}
#tour_btn_area .wrap{
    margin: 0 auto;
    padding: 0;
}
#tour_btn_area .container{
    justify-content: space-between;
}
#tour_btn_area li{
    margin: 0;
}
#tour_btn_area a{
    display: block;
    font-size: 24px;
    line-height: 3.5;
    font-weight: bold;
    text-decoration: none;
    width: 280px;
    padding: 0 30px;
    margin: 10px;
    background: url(../images/tour_btn_bg.jpg);
    background-color: #ffbf00;
    border-radius: 3.5em;
}
#tour_btn_area a:hover{
    opacity: 0.7;
}
#tour_btn_area img{
    margin: 40px auto;
}
.modelplan_wrap{
    margin: 40px auto;
    padding: 0 0 60px;
    width: 1100px;
    font-size: 14px;
}
.tab{overflow:hidden;}
.tab li {
    width: 320px;
    font-weight: bold;
    background: #fff;
    float: left;
    text-align: center;
    padding: 0 0 10px;
    -moz-transition: all 0.2s linear;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
    margin: -20px 23px 0;
    font-size: 20px;
    line-height: 1.2;
}
.tab li.select{
    background:#ffff00;
    margin-top: 0;
}
.tab li span.sub_ttl{
    background-color: #fff;
    width: 70%;
    display: inline-block;
    margin: 10px 0;
    font-size: 14px;
    padding: 0.5em 0 0.25em;
}
.content{
    background-color: #fff;
}
.content .inner {
    line-height: 2em;
    overflow: hidden;
}
.content .inner .model_day {
    font-size: 20px;
    font-weight: bold;
    padding: 10px 0;
    background-color: #ffff00;
    text-align: center;
}
.content .inner .model_day span{
    font-weight: bold;
    font-size: 0.75em;
    background-color: #fff;
    padding: 0.25em 1em;
}
.content .inner .txt_box{
    width: 470px;
    padding: 40px;
    text-align: left;
    font-size: 15px;
    line-height: 1.8;
}
.content .inner .txt_box span{
    font-weight: bold;
    color: #ff4c4c;
}
.content .inner .txt_box span.cap{
    font-weight: normal;
    color: #333;
    font-size: 12px;
    line-height: 1.2;
}
.content .inner .flt_l{
    float: left;
}
.content .inner .flt_r{
    float: right;
}
.hide {
    display:none;
}

#add_footer a{
    display:block;
    position: fixed;
    right: 40px;
    bottom: 40px;
    z-index: 10;
}
/*----------------------�X�}�z��-----------------------*/

@media screen and (max-width: 768px) {
#main .pc {
    display: none!important;
}
#main .sp {
    display: block !important;
}
#main {
    width: 100%;
    margin: 0 auto;
    font-size: 13px;
    line-height: 1.45;
}
#main img {
    width: 100%;
}
#main .wrap {
    width: 90%;
    padding: 1em 0 0;
}
.container {
    align-items: flex-start;
}
.mv {
    width: 100%;
    height: auto;
    background: url(../images/sp_main_bg.jpg)center top no-repeat;
    background-size: contain;
}
.mv .wrap {
    padding: 1em 0 0!important;
    top: 12em;
}
#main .mv h2{
    font-size: 30px;
    line-height: 1.1;
    letter-spacing: -2px;
}
#main .mv h2 .sub{
    display: inline-block;
    font-size: 18px;
    margin-bottom: 5px;
    line-height: 1.3;
}
#main .mv p{
    font-size: 1em;
    line-height: 1.75;
    margin-top: 1em;
    padding: 0;
}
#main .mv img{
    width: 1.5em;
    margin-top: 1em;
}
.conts_navi .wrap{
    width: 100%!important;
    margin: 12em auto 0;
    padding: 2em 0 0em!important;
}
.conts_navi h3{
    font-size: 18px!important;
    margin: 0 5% 0.25em;
}
.conts_navi li{
    width: 50%;
}
.conts_navi a{
    font-size: 16px;
    font-weight: bold;
    width: 80%;
    padding: 0.5em 10%;
}
.txt_area{
    margin-top: -2em;
    padding-bottom: 2.5em;
}
.txt_area p{
    text-align: left;
}

#conts_01 h3, #conts_02 h3, #conts_03 h3, #conts_04 h3, #conts_05 h3, #conts_06 h3 {
    font-size: 24px!important;
    padding: 1.5em 0 0!important;
}
#conts_01 h3 span, #conts_02 h3 span, #conts_03 h3 span, #conts_04 h3 span, #conts_05 h3 span, #conts_06 h3 span {
    font-size: 44px!important;
}
#conts_01 h4, #conts_02 h4, #conts_03 h4, #conts_04 h4, #conts_05 h4 {
    width: 100%;
    line-height: 1.4;
    font-size: 16px;
    padding: 1em 0.5em;
}
#conts_04 h4 {
    padding-top: 1em;
}
#conts_05 h4 {
    padding-top: 1em;
}
#conts_01 .txt_area .container {
    flex-direction: column;
}
#conts_01 .txt_area .container div{
    width: 100%;
}
#conts_01 h5, #conts_02 h5, #conts_03 h5, #conts_04 h5, #conts_05 h5 {
    font-size: 16px!important;
    margin-top: 2em;
}
#conts_05 .guide_btn a{
    font-size: 15px;
    padding: 0.5em;
    margin: 1em auto 0.5em;
    width: 95%;
}
#tour_btn_area h3{
    font-size: 18px!important;
    margin-top: 1em;
    margin: 0 5% 0;
}
#tour_btn_area .wrap{
    padding: 0 0 1em;
}
#tour_btn_area .container{
    justify-content: space-around;
}
#tour_btn_area li{
    margin: 5px 0;
    width: 45%;
}
#tour_btn_area a{
    font-size: 16px;
    line-height: 3;
    width: 100%;
    padding: 0;
    margin: 0;
}
#tour_btn_area img{
    width: 1.5em;
    margin: 1em auto;
}
    


#conts_06 .modelplan_wrap{
    margin: 0 auto;
    padding: 0 0 2.5em;
    width: auto;
    font-size: 13px;
}
#conts_06 .tab {
    margin-bottom: 1em;
}
#conts_06 .tab li {
    width: auto;
    height: 5em;
    float: none;
    text-align: left;
    padding: 0;
    margin: 10px 2%;
    font-size: 15px;
    overflow: hidden;
    border-radius: 2.5em;
}
#main .tab li img{
    float: left;
    width: 33%;
}
#conts_06 .tab .txt_wrap{
    width: 63%;
    float: right;
    padding: 0 5px;
    font-weight: bold;
}
#conts_06 .tab li span{
    background-color: #fff;
    width: auto;
    margin: 4px 0;
    font-size: 13px;
    padding: 0.5em 0.75em 0.25em 0.5em;
}
#conts_06 .tab li.select span{
    background-color: #fff;
}
.content {
    width: 90%;
    margin: 0 auto;
    background: none;
}
.content h4 {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 0.25em;
}
.content .inner {
    line-height: 1.4em;
    background: #fff;
}
.content .inner .model_day {
    font-size: 16px;
    padding: 0.5em 0;
}
.content .inner .txt_box{
    width: auto;
    padding: 1em;
    font-size: 13px;
    line-height: 1.5;
}
.content .inner .flt_l{
    float: none;
}
.content .inner .flt_r{
    float: none;
}



#add_footer a{
    width: 5em;
    right: 1em;
    bottom: 1em;
}
}
/*----------------------top�֖߂�----------------------*/
#return_top {
    text-align: center;
    margin: 10px;
}
#return_top a {
    background: url("https://image.stworld.jp/images/common/tri01.gif") no-repeat scroll left 5px rgba(0, 0, 0, 0);
    line-height: 1em;
    padding-left: 10px;
}