@charset "utf-8";

/*-----------------------------------
radius
-----------------------------------*/
.main-box,
.pic img,
.rank-box,
.side-inq,
.side-inq dl{
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
#main h2,
.news-cate{
    border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;  
}
.box:last-child a:hover,
#news .news-list li:last-child{
    border-radius: 0 0 5px 5px;
    -webkit-border-radius: 0 0 5px 5px;
    -moz-border-radius: 0 0 5px 5px;    
}

/*-----------------------------------
box
-----------------------------------*/
.box a,.box a:hover,.box a:visited,
.more a,.more a:hover,.more a:visited{
    color: #333;
    text-decoration: none;
}
.box a{
    display: block;
}
.box a:hover{
    background-color: #F4FBFB;
}
.summary,
.summary-off{
    display: table;
}
.summary{
    border-bottom: 1px dotted #666;
}
.box .pic,
.box dl{
    display: table-cell;
    vertical-align: top;
}
.box dt{
    margin-bottom: 3px;
    font-weight: bold;
    color: #006699;
    text-decoration: underline;
    background-position: 0 3px;
}
.more a{
    display: block;
    padding: 5px 13px 5px 34px;
    background: url(/static/image/icon/arrow01.png) 10px 8px no-repeat;
    -webkit-background-size: 18px 18px;
    -moz-background-size: 18px 18px;
    -o-background-size: 18px 18px;
    -ms-background-size: 18px 18px;
    background-size: 18px 18px;
}

/*--Large screens--*/
@media print, screen and (min-width: 40.063em){
    .box a{
        padding: 20px 20px 0;
    }
    .summary,
    .summary-off{
        padding-bottom: 20px;
    }
    .pic{
        width: 80px;
        padding-right: 15px;
    }
    .pic img{
        width: 80px;
    }
    .more{
        border-left: 1px dotted #333;
    }
    .more a{
        margin-left: 5px;
    }
    .more a:hover{
        background-color: #F4FBFB;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
    }
    .more a{
        display: block;
    }
}

/*--Small screens--*/
@media only screen and (max-width: 40em){
    .box a{
        padding: 0.9375em 0.9375em 0;
    }
    .summary,
    .summary-off{
        padding-bottom: 0.9375em;
    }
    .pic{
        width: 80px;
        padding-right: 10px;
    }
    .more a{
        background-color: #DBF2F2;
    }
}

/*--Medium screens--*/
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
    .main-box.tax{
        margin-left: 12px;
    }
    .main-box.exception{
        margin-right: 12px;
    }
    .more{
        position: absolute;
        top: 10px;
        right: 10px;
        border-left: 1px dotted #333;
        font-size: 95%;
    }
    .more a{
        padding: 5px 5px 5px 26px;
        background: url(/static/image/icon/arrow01.png) 7px 10px no-repeat;
        -webkit-background-size: 15px 15px;
        -moz-background-size: 15px 15px;
        -o-background-size: 15px 15px;
        -ms-background-size: 15px 15px;
        background-size: 15px 15px;
    }
}

/*-----------------------------------
main
-----------------------------------*/
#main{
    background-color: #88cfd0; /* Old browsers */
    background-color: -moz-linear-gradient(top,  #88cfd0 0%, #96d6d6 50%); /* FF3.6+ */
    background-color: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#88cfd0), color-stop(50%,#96d6d6)); /* Chrome,Safari4+ */
    background-color: -webkit-linear-gradient(top,  #88cfd0 0%,#96d6d6 50%); /* Chrome10+,Safari5.1+ */
    background-color: -o-linear-gradient(top,  #88cfd0 0%,#96d6d6 50%); /* Opera 11.10+ */
    background-color: -ms-linear-gradient(top,  #88cfd0 0%,#96d6d6 50%); /* IE10+ */
    background-color: linear-gradient(to bottom,  #88cfd0 0%,#96d6d6 50%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#88cfd0', endColorstr='#96d6d6',GradientType=0 ); /* IE6-8 */
    background-image: url(/static/image/top/main-bkg.png);
    background-position: center bottom;
    background-repeat: repeat-x;
    background-color: #88CFD0;
    color: #FFF;
    text-align: center;
}
#main p.main-txt{
    font-size: 2.8em;
    font-weight: bold;
}
#main p.sub-txt{
    font-size: 1.5em;
    font-weight: bold;
}
.main-box{
    position: relative;
    background: #FFF;
}
#main h2{
    background-color: #F7F7F7;
    border-bottom: 1px solid #FFF;
}

#main .box dt{
    padding-left: 25px;
    background-position: 0 3px;
    background-repeat: no-repeat;
    -webkit-background-size: 20px 20px;
    -moz-background-size: 20px 20px;
    -o-background-size: 20px 20px;
    -ms-background-size: 20px 20px;
    background-size: 20px 20px;
}
.tax .box dt{
    background-image: url(/static/image/icon/sad.png);
}
.exception .box dt{
    background-image: url(/static/image/icon/smile.png);
}

/*--Large screens--*/
@media print, screen and (min-width: 40.063em){
    #main{
        margin-top: 5px;
        margin-bottom: 40px;
        padding: 40px 0 60px;
    }
    .main-box{
        padding: 25px 0 0;
    }
    #main .lead{
        position: absolute;
        top: -12px;
        left: -20px;
    }
    #main .lead img{
        width: 163px;
    }
    #main .lead span{
        display: none;
    }
    #main h2{
        margin: -25px 0 0;
        padding: 10px 20px 20px;
    }
    #main h2 img{
        margin-left: 135px;
        height: 19px;
    }
    #main .more{
        position: absolute;
        top: 10px;
        right: 10px;
    }
}

/*--Small screens--*/
@media only screen and (max-width: 40em){
    #main{
        margin-bottom: 0.9375em;
        padding: 20px 0 30px;
    }
    #main p.main-txt{
        font-size: 1.8em;
    }
    #main p.sub-txt{
        font-size: 0.9em;
    }
    .main-box{
        margin-bottom: 0.9375em;
    }
    #main .lead img{
        display: none;
    }
    #main .lead{
        padding: 3px 10px;
        background: #3D8D8B;
        border-radius: 5px 5px 0 0;
        -webkit-border-radius: 5px 5px 0 0;
        -moz-border-radius: 5px 5px 0 0;  
        font-size: 85%;
        color: #FFF;
    }
    #main h2{
        margin: 0;
        padding: 5px 10px 13px;
    }
    #main h2 img{
        height: 18px;
    }
}

/*--Medium screens--*/
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
    #main p.main-txt{
        font-size: 2.5em;
    }
    #main p.sub-txt{
        font-size: 1.2em;
    }
    #main .lead{
        top: -10px;
        left: -15px;
    }
    #main .lead img{
        width: 100px;
    }
    #main h2 img{
        margin-left: 30px;
        height: 15px;
    }
}

/*-----------------------------------
raniking
-----------------------------------*/
#ranking{
    position: relative;
}
#ranking h2{
    background: url(/static/image/icon/ranking.png) 0 7px no-repeat;
    -webkit-background-size: 25px 18px;
    -moz-background-size: 25px 18px;
    -o-background-size: 25px 18px;
    -ms-background-size: 25px 18px;
    background-size: 25px 18px;
    border-bottom: 1px dotted #333;
}
.rank-box{
    position: relative;
    background: #F7F7F7;
}
.rank-box h3{
    position: absolute;
    top: -10px;
    left: -10px;
    padding: 5px 15px;
    background: #3D8D8B;
    font-size: 102%;
    color: #FFF;
}
.rank-box h3:after {
    content: "";
    position: absolute;
    top:　0;
    left: -32px;
    content: "";
    border: 32px solid transparent;
    border-right-color: #003333 ;
    z-index: -1;
}
.rank-box h3 span{
    margin: 0 3px;
    text-decoration: underline;
}

.rank-box h3+div.box a{
    padding-top: 40px;
}

#ranking .pic{
    text-align: center;
}

/*--Large screens--*/
@media print, screen and (min-width: 40.063em){
    #container{
        padding-bottom: 40px;
    }
    #ranking{
        margin-bottom: 40px;
    }
    #ranking h2{
        margin-bottom: 30px;
        padding: 0 130px 8px 35px;
        font-size: 130%;
    }
    #ranking .more{
        position: absolute;
        top: 0;
        right: 5px;
    }
    .pic img.rank{
        width: 50px;
        margin: 0 0 10px 0;
    }
}

/*--Small screens--*/
@media only screen and (max-width: 40em){
    #container{
        padding-bottom: 0.9375em;
    }
    #ranking h2{
        margin-bottom: 1px;
        padding: 0 0 5px 35px;
        font-size: 115%;
        font-weight: bold;
    }
    .rank-box h3:after {
        content: "";
        position: absolute;
        top:　0;
        left: -29px;
        content: "";
        border: 29px solid transparent;
        border-right-color: #003333 ;
        z-index: -1;
    }
    #ranking .more{
        margin-bottom: 20px;
    }
    .rank-box {
        margin-bottom: 0.9375em;
    }
    .pic img.rank{
        width: 50px;
        margin-bottom: 10px;
    }
}

/*--Medium screens--*/
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
    .rank-box{
        margin-bottom: 25px;
    }
}

/*-----------------------------------
simulation
-----------------------------------*/
/*--Large screens--*/
@media print, screen and (min-width: 40.063em){
    #simulation{
        margin-bottom: 40px;
    }
    #simulation h2{
        margin-bottom: 15px;
    }
}
/*--Small screens--*/
@media only screen and (max-width: 40em){
    #simulation{
        margin-bottom: 0.9375em;
    }
    #simulation h2{
        margin-bottom: 10px;
    }
}

/*-----------------------------------
news
-----------------------------------*/
#news h2{
    border-bottom: 1px dotted #333;
}
.news-cate{
    color: #fff;
}
.news-list li{
    padding: 5px;
    border-bottom: 1px dotted #333;
}
#news .news-list li:last-child{
    border-bottom: none;
}
.news-list .ttl a{
    display: block;
}

/*--Large screens--*/
@media print, screen and (min-width: 40.063em){
    #news h2{
        margin-bottom: 2px;
        padding: 0 35px 8px;
        background: url(/static/image/icon/news02-s.png) 0 3px no-repeat;
        font-size: 130%;
    }
    #news .date{
        float: left;
        width: 15%;
    }
    #news .ttl{
        float: left;
        width: 85%;
        padding-right: 10px;
    }
    #news .news-list li{
        margin-bottom: 2px;
        padding: 8px 20px;
        border-bottom: none;
    }
    #news .news-list li:nth-child(odd){
        background: #f7f7f7;
    }
    .side-news{
        margin-bottom: 25px;
    }
    .news-cate{
        padding: 5px 15px 5px 38px;
        background: url(/static/image/icon/news01-s.png) 15px 7px no-repeat #3d8d8b;
    }
}

/*--Small screens--*/
@media only screen and (max-width: 40em){
    #news{
        margin-bottom: 0.9375em;
    }
    #news h2{
        margin-bottom: 1px;
        padding: 0 0 5px 35px;
        background: url(/static/image/icon/news02.png) 0 1px no-repeat;
        -webkit-background-size: 32px 24px;
        -moz-background-size: 32px 24px;
        -o-background-size: 32px 24px;
        -ms-background-size: 32px 24px;
        background-size: 32px 24px;
        font-size: 115%;
        font-weight: bold;
    }
    .side-news{
        margin-bottom: 0.9375em;
    }
    .news-cate{
        padding: 5px 10px 5px 32px;
        background: url(/static/image/icon/news01.png) 10px 7px no-repeat #3d8d8b;
        -webkit-background-size: 21px 19px;
        -moz-background-size: 21px 19px;
        -o-background-size: 21px 19px;
        -ms-background-size: 21px 19px;
        background-size: 21px 19px;
    }
}

/*--Medium screens--*/
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
    #news .date{
        width: 20%;
    }
    #news .ttl{
        width: 80%;
    }
}

/*-----------------------------------
side-inq
-----------------------------------*/
.side-inq{
    border: 1px solid #666;
}
.side-inq dl{
    background: #F7F7F7;
    border: 1px solid #FFF;
    text-align: center;
}
.side-inq dt{
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px dotted #333;
    letter-spacing: 0.3em;
}
.side-inq li.mail a,.side-inq li.mail a:hover,.side-inq li.mail a:visited{
    color: #FFF;
    text-decoration: none;
}
.side-inq li.tel a,.side-inq li.tel a:hover,.side-inq li.tel a:visited{
    font-weight: bold;
    color: #333;
    text-decoration: none;
}
.side-inq li.mail a{
    display: block;
    width: 80%;
    margin: 0 auto 15px;
    background: #333;
    background-image: url(/static/image/icon/mail.png);
    background-repeat: no-repeat;
    -webkit-background-size: 18px 13px;
    -moz-background-size: 18px 13px;
    -o-background-size: 18px 13px;
    -ms-background-size: 18px 13px;
    background-size: 18px 13px;
}
.side-inq li.mail a:hover{
    background-color: #000;
}
.side-inq li.tel{
    line-height: 1.1;
}
.side-inq li.tel a{
    padding-left: 30px;
    background-image: url(/static/image/icon/fd-gray.png);
    background-repeat: no-repeat;
    -webkit-background-size: 25px 16px;
    -moz-background-size: 25px 16px;
    -o-background-size: 25px 16px;
    -ms-background-size: 25px 16px;
    background-size: 25px 16px;
}
.side-inq li.tel span{
    font-size: 65%;
}

/*--Large screens--*/
@media print, screen and (min-width: 40.063em){
    .side-inq{
        margin-bottom: 25px;
    }
    .side-inq dl{
        padding: 15px 15px 20px;
    }
    .side-inq dt{
        font-size: 130%;
    }
    .side-inq p{
        margin-bottom: 15px;
        font-size: 80%;
    }
    .side-inq li.mail a{
        padding: 3px 15px 3px 45px;
        font-size: 95%;
        background-position: 20px 8px;
    }
    .side-inq li.tel{
        font-size: 125%;
    }
    .side-inq li.tel a{
        background-position: 0 4px;
    }
}

/*--Small screens--*/
@media only screen and (max-width: 40em){
    .side-inq{
        margin-bottom: 0.9375em;
    }
    .side-inq dl{
        padding: 10px 10px 15px;
    }
    .side-inq dt{
        font-size: 140%;
    }
    .side-inq p{
        margin-bottom: 10px;
    }
    .side-inq li.mail a{
        padding: 10px 15px 10px 45px;
        font-size: 120%;
        background-position: 20px 18px;
    }
    .side-inq li.tel{
        font-size: 140%;
    }
    .side-inq li.tel a{
        background-position: 0 4px;
    }
}

/*-----------------------------------
side-link
-----------------------------------*/
.side-link li{
    border: 1px solid #999;
}

/*--Large screens--*/
@media print, screen and (min-width: 40.063em){
    .side-link,
    .side-ban{
        margin-bottom: 25px;
    }
    .side-link li,
    .side-ban li{
        margin-bottom: 10px;
    }
    .side-link li:last-child,
    .side-ban li:last-child{
        margin-bottom: 0;
    }
    .side-link li a{
        display: block;
        padding-top: 11px;
        padding-left: 37px;
        padding-bottom: 11px;
        background-repeat: no-repeat;
        background-position: 11px center, 95% center;
        font-size: 95%;
    }
    .side-link li a,.side-link li a:hover,.side-link li a:visited{
        color: #333;
        text-decoration: none;
    }
    .side-link li a:hover{
        background-color: #F4FBFB;
    }
    .side-link li.law a{
        padding-right: 30px;
        background-image: url(/static/image/top/sub-link-law_icon.png), url(/static/image/top/sub-link-law_en.png);
    }
    .side-link li.staff a{
        padding-right: 37px;
        background-image: url(/static/image/top/sub-link-staff_icon.png), url(/static/image/top/sub-link-staff_en.png);
    }
    .side-link li.company a{
        padding-right: 65px;
        background-image: url(/static/image/top/sub-link-company_icon.png), url(/static/image/top/sub-link-company_en.png);
    }
}

/*--Small screens--*/
@media only screen and (max-width: 40em){
    .side-link{
        margin-bottom: 0.9375em;
    }
    .side-link li{
        float: left;
        width: 49%;
        margin-bottom: 2%;
    }
    .side-link li:last-child,
    .side-ban li:last-child{
        margin-bottom: 0;
    }
    .side-link li:nth-child(2n){
        margin-left: 2%;
    }
    .side-link li span{
        display: none;
    }
    .side-link li{
        margin-bottom: 2%;
    }
    .side-ban li.ouchi a{
        display: block;
        background-image: url(/static/image/s/common/ban-ouchi.png);
        background-repeat: no-repeat;
        background-position: left center;
        background-size: cover;
        padding-top: 20%;
        width: 100%;
    }
    .side-ban li.ouchi img{
        display: none;
    }
}

/*-----------------------------------
clear
-----------------------------------*/
.news-list li
{
    display: block;
    min-height: 1%;
}
.news-list li:after
{
    clear: both;
    content:".";
    display: block;
    height: 0;
    visibility: hidden;
}