#front-main .flex-center {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    list-style-type: none;
    }

#front-main .flex-start {
    display: flex;
    flex-wrap: wrap;
    align-items: start;
    list-style-type: none;
    }

#front-main .col-6 {
    width: calc( 100% / 6);
}
#front-main .col-5 {
    width: calc( 100% / 5);
}
#front-main .col-4 {
    width: calc( 100% / 4);
}
#front-main .col-3 {
    width: calc( 100% / 3);
}
#front-main .col-2 {
    width: calc( 100% / 2);
}
#front-main .col-1 {
    width: calc( 100% / 1);
}




.half{width:50%;}
.height-50{height:50px;}


/* padding関連 */

#front-main .pad-24 {
    padding: 24px;
}
#front-main .pad-20 {
    padding: 20px;
}
#front-main .pad-20-30 {
    padding: 20px 30px;
}
#front-main .pad-20-8 {
    padding: 20px 8px;
}
#front-main .pad-16 {
    padding: 16px;
}
#front-main .pad-12 {
    padding: 12px;
}
#front-main .pad-10 {
    padding: 10px;
}
#front-main .pad-8 {
    padding: 8px;
}
#front-main .pad-4 {
    padding: 4px;
}
#front-main .pad-top-16 {
    padding: 16px 0 0 0;
}
#front-main .pad-top-8 {
    padding: 8px 0 0 0;
}
#front-main .pad-tb-16 {
    padding: 16px 0;
}
#front-main .pad-rgt-16 {
    padding: 0 16px 0 0;
}



/* margin関連 */

#front-main .mar-20 {
    margin: 20px;
}
#front-main .mar-16 {
    margin: 16px;
}
#front-main .mar-12 {
    margin: 12px;
}
#front-main .mar-10 {
    margin: 10px;
}
#front-main .mar-8 {
    margin: 8px;
}
#front-main .mar-4 {
    margin: 4px;
}


/* フォント関連 */
.fnt-wgt-bld{font-weight: bold;}



.fnt-siz-50{font-size: 50px;
}
.fnt-siz-16{font-size: 16px;
}
.fnt-siz-18{font-size: 18px;
}
.fnt-siz-20{font-size: 20px;
}
.fnt-siz-22{font-size: 22px;
}
.fnt-siz-26{font-size: 26px;
}

.bg-gray{
    background-color: #f1f1f1;
}
.bg-grn-grd{
    background: #289254;
    background: -webkit-linear-gradient(to left, #a8e063, #289254);
    background: linear-gradient(to left, #a8e063, #289254);
}
.bg-grn{
    background: #1E9357;
}


.fnt-clr-777{color: #777;}


.right{
    text-align: right;
}

.left{
    text-align: left;
}

.center{
    text-align: center;
}

.txt-col-wht{color: #fff;}
.txt-sdw{text-shadow: 0 1px 6px rgba(0,0,0,0.8);}


.top{    background: url(../img/frontpage-top-bg.jpg) no-repeat center center;background-size: cover;
}


.section-inner{width: 1080px;margin: 0 auto;padding: 64px 0;}
.support .section-inner,.top .section-inner,.security .section-inner {width: 1080px;margin: 0 auto;padding: 64px 0 0 0;}


section{margin: 0;}
#front-main h2 {
    font-weight: bold;
    font-size: 40px;
    text-align: center;
    margin: 20px 0;
    line-height: 1.4;
    border: none;
    padding: 0;
}
#front-main .h2-sub {
    font-size: 18px;
    text-align: center;
    margin: 20px 0;
}



.txt-ctr{text-align: center;}


.top-btn-top {
    background: #1E9357;
    color: #fff;
    border-radius: 6px;
    display: block;
    width: 100%;
    line-height: 54px;
    text-align: center;
    font-size: 20px;
margin: 16px 0 64px 0;
    border: 1px solid #fff;

}

.top-btn-top:hover {
    background: #fff;
    color: #1E9357;
    transition: all .4s ease;
}




.top-btn {
    background: #1E9357;
    color: #fff;
    border-radius: 6px;
    display: block;
    width: 440px;
    line-height: 54px;
    text-align: center;
    font-size: 20px;
    margin: 40px auto;
    border: 1px solid #fff;

}

.top-btn:hover {
    background: #fff;
    color: #1E9357;
    border-radius: 6px;
    display: block;
    width: 440px;
    line-height: 54px;
    text-align: center;
    font-size: 20px;
    margin: 40px auto;
    border: 1px solid #1E9357;transition: all .4s ease;
}



.top-btn--mini-full {
    background: #fff;
    color: #1E9357;
    border-radius: 4px;
    display: block;
    width: 100%;
    line-height: 30px;
    text-align: center;
    font-size: 16px;
    margin: 16px auto 0;
    border: 1px solid #aaa;
}
.top-btn--mini-full:hover {
    background: #1E9357;
    color: #fff;
    border-radius: 4px;
    display: block;
    width: 100%;
    line-height: 30px;
    text-align: center;
    font-size: 16px;
    margin: 16px auto 0;
    border: 1px solid #aaa;
    transition: all .4s ease;
}




.top-left {padding-right:40px; }



#front-main .text-normal {
    text-align: center;
    font-size: 16px;
    line-height: 1.8em;
    width: 80%;
    margin: 50px auto;
}



#front-main .history{
	    background: url(../img/history-bg.jpg) no-repeat center center;background-size: cover;
}
#front-main .consult {
    background: url(../img/consult-bg.jpg) no-repeat center center;background-size: cover;
}



#front-main .history h2,#front-main .history .text-normal{
color: #fff;text-shadow: 0 1px 6px rgba(0,0,0,0.8);}




#front-main .price-zone{
	    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    list-style-type: none;
    padding: 0;

}
.price-zone p{
	text-align: center;
	color: #777;
	font-size: 20px;
	padding: 20px;}
#front-main .price-box{
background-color: #fff;
}
#front-main .plan-title{
    text-align: center;
    padding: 10px;
    font-size: 20px;
    background: #289254;
    background: -webkit-linear-gradient(to left, #a8e063, #289254);
    background: linear-gradient(to left, #a8e063, #289254);
    color: #fff;}

.plan-discription {
    padding: 16px;
    font-size: 20px;
    border-bottom: 1px solid #eee;
    border-top: 1px solid #eee;
    margin: 0 16px;
}

#front-main .top h1 {
    font-weight: bold;
    font-size: 50px;
    text-align: left;
    line-height: 1.4em;
    border: none;
    padding: 0;margin:0;
}
#front-main .top .h2-sub {
    font-size: 20px;
    text-align: left;
    margin: 0;
}

#front-main .price-box2{    width: 25%;
    padding: 20px;
    border: 1px solid #ddd;
}



.col-3-mgn{
    width: 320px;
    background: #fff;
    border: solid 1px #999;
    margin: 20px;
}








.table-title{    color: #fff;
    text-align: center;
    padding: 16px;
    border-bottom: 1px solid #fff;
    font-size: 20px;line-height: 20px;}
.table-title-last{    color: #fff;
    text-align: center;
    padding: 16px;
    font-size: 20px;line-height: 20px;}

    .table-other{
    padding: 16px;
line-height: 20px;    background: #b3e9a7;
    text-align: center;    margin-bottom: 1px;
}
    .table-cr{
    padding: 16px;
line-height: 20px;    background: #fff;
    text-align: center;    margin-bottom: 1px;
}

.hikaku{width: 16%;}
.muryou,.cr,.kaihatsu{width: 28%;}


    .table-other-com{
    padding: 16px;
line-height: 20px;    background: #42a257;
    text-align: center;    margin-bottom: 1px; color:#fff;
}

.kuwashiku{display: block;text-align: right;margin-top: 10px;}

.kuwashiku-white{display: block;text-align: right;margin-top: 10px;text-shadow: 0 1px 6px rgba(0,0,0,0.8);color: #fff;text-decoration: underline;}
.kuwashiku-white:hover{display: block;text-align: right;margin-top: 10px;text-shadow: 0 1px 6px rgba(0,0,0,0.8);color: #fff;text-decoration: none;}


.news-more{
    text-align: center;
    display: block;
}































@media screen and (max-width: 768px) {
.section-inner {
    width: 100%;
    margin: 0 auto;
    padding: 24px 14px;
    }
.support .section-inner,.top .section-inner,.security .section-inner{width: 100%;margin: 0 auto;padding: 24px 14px 0;}

#front-main h2 {
    font-weight: bold;
    font-size: 24px;
    text-align: center;
    margin: 20px 0;
    line-height: 1.4;
    border: none;
    padding: 0;
}


#front-main .flex-center {
    display: ;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    list-style-type: none;
    }

#front-main .flex-start {
    display: ;
    flex-wrap: wrap;
    align-items: start;
    justify-content: space-between;
    list-style-type: none;
    }
#front-main .col-6 {
    width: calc( 100% / 3);
}
#front-main .col-5 {
    width:100%;
}
#front-main .col-4 {
    width: 100%;
}
#front-main .col-3 {
    width: 100%;
}
#front-main .col-2 {
    width: 100%;
}
#front-main .col-1 {
    width: 100%;
}

.top-btn {
    background: #1E9357;
    color: #fff;
    border-radius: 6px;
    display: block;
    width: 100%;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    margin: 20px auto;
    border: 1px solid #fff;
}
.top-btn:hover {
    background: #fff;
    color: #1E9357;
    border-radius: 6px;
    display: block;
    width: 100%;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    margin: 20px auto;
    border: 1px solid #1E9357;
    transition: all .4s ease;
}


#front-main .h2-sub {
    font-size: 14px;
    text-align: center;
    margin: 20px 0;
}





.fnt-siz-50{font-size: 30px;
}
.fnt-siz-16{font-size: 14px;
}
.fnt-siz-18{font-size: 16px;
}
.fnt-siz-20{font-size: 18px;
}
.fnt-siz-22{font-size: 20px;
}
.fnt-siz-26{font-size: 22px;
}


#front-main .text-normal {
    text-align: center;
    font-size: 14px;
    line-height: 1.6em;
    width: 100%;
    margin: 30px auto;
}


.col-3-mgn {
    width: 100%;
    background: #fff;
    border: solid 1px #999;
    margin: 20px;
}

#front-main .pad-24 {
    padding: 16px;
}

.mobile-none{display: none;}
.muryou, .cr, .kaihatsu {
    width: 100%;
    margin: 16px 0;
}



#front-main .top h2 {
    font-weight: bold;
    font-size: 28px;
    text-align: center;
    line-height: 1.4em;
    border: none;
    padding: 0;
}
#front-main .top .h2-sub {
    font-size: 16px;
    text-align: center;
    margin: 0;
}


.top-left {padding:0; }

 #front-main .sp-pad-20-20{padding: 20px 20px;}
 #front-main .sp-pad-20-8{padding: 20px 8px;}

	}







  .section-cotol {
      margin: 0;
      background: #fefbf4;
  }



  .section-inner-cotol {
      width: 1080px;
      margin: 0 auto;
      padding: 12px 0;
  }

  .cotol-btn {
      background: #f5b758;
      color: #fff;
      border-radius: 6px;
      display: block;
      width: 100px;
      line-height: 26px;
      text-align: center;
      float: left;
      margin-right: 12px;
  }

.section-cotol a{      line-height: 26px;
}

.external-link{      width: 16px; height: 16px; fill:#337ab7;
}

.section-inner-cotol .cotol-link:hover > .external-link {
    fill: #23527c;
}


@media screen and (max-width: 768px) {
.section-inner-cotol {
    width: 100%;
    margin: 0 auto;
    padding: 8px 8px;
}
.cotol-btn {
    float: none;
    margin-bottom: 6px;
}
.section-cotol a{      line-height: normal;
}
}