@charset "utf-8";

#mainvd{background: url(../../img/mainvd_sub.png);background-repeat: no-repeat; background-position:center; background-size: cover;}
#mainvd article{background: rgba(0,177,235,0.07); padding:85px 0px 85px;}
#mainvd .article_r{float:right; padding:10px 0px; width:44%;}

#one{margin:50px 0 0 0;}
#one h2{margin-bottom:35px;}
#one strong{font-size:45px;}
#one small{font-size:25px; font-weight:700;margin-right:5px;}
#one .inner>ul{border-radius: 5px; padding:2px 2px;margin:0 auto; width:75%;text-align: left;}
#one .inner>ul.cost01{border:2px solid rgba(0,174,230,0.7);margin-bottom:10px;}
#one ul.cost01 li:first-child{background: rgba(0,174,230,0.7); padding:80px 80px;}
#one .inner>ul.cost02{border:2px solid #4af3c7;}
#one ul.cost02 li:first-child{background: #4af3c7; padding:35px 55px; }
#one .inner>ul .red{font-size:55px;font-weight:600;}
#one .inner>ul strong{font-size:30px; margin-right:10px;letter-spacing: -8px;}
#one .inlineBlock>li{vertical-align: middle;}
#one li:first-child{font-size:25px;display: inline-block;color:#fff; font-weight:400; border-radius: 4px; margin-right:90px;}
#one li:nth-child(2){padding:10px 0 0 0;}

#one h3{background:#00aee6;color:#fff; font-size:20px; padding:10px 0;}
#one .caption{text-align: right; width:88.5%}

#one ul.fadein:nth-of-type(2) {
    -moz-transition-delay:200ms;
    -webkit-transition-delay:200ms;
    -o-transition-delay:200ms;
    -ms-transition-delay:200ms;
    }
#one .tx01_sub{text-align: right;}
#one .tx01_sub.mb{margin-bottom: 18px; text-align: right;}



#two{margin:40px 0 0 0;}
#two h2{margin-bottom:35px;}
#two table{width:100%; text-align: center; font-size: 13px;}
#two td,th{border:1px solid #C8C8C8; padding:2px 25px; vertical-align: middle;}
#two .blue{background:#dff0f4;}
#two strong{font-weight:500;}
#two .width{width:70px;}
#two .caption{margin:25px 0 0 0;}
#two a{color:#00aee6;}
#two a:hover{text-decoration: underline;}
#two .red{font-size:12px;}

#three{font-size:13px; color:#5F5F5F; margin:25px 0 70px 0;}
#three a{color:#00aee6;}
#three h4{font-size:18px;}
#three .cap01{margin-bottom: 20px;}
p.square{position: relative; padding-left:20px;}
p.square:before{
  content: "";
  display: block;
  position: absolute;
  left: 4px;
  height: 12px;
  width: 12px;
  border-radius: 10%;
  background: #5F5F5F;
  top: 50%;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);}

@media screen and (max-width : 640px ){
    #one .inner>ul{
        width:100%;
    }
    #one ul.cost01 li:first-child,
    #one ul.cost02 li:first-child{
        width: 100%;
        text-align: center;
        padding: 10px 0px;
    }
    #one li:nth-child(2){
        padding: 25px 0px 10px 0px;
        text-align: center;
        width: 100%;
    }
    #one .caption{
        width: 100%;
        text-align: left;
    }
    #two .div_table{
        width  :100%;
        overflow-x: auto;
    }
    p.square:before{
        top:13px;
    }
}