@charset "utf-8";


/* -- main visual・common
-------------------------------------------------------------------------------- */
article > h1 {
    font: bold 27px "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif;
    line-height: 1.3;
    background: url(/img/forcompany/vis.jpg) no-repeat center 0;
    padding-top: 70px;
}
article h2 {
    font-size: 23px;
    line-height: 1.25;
    font-weight: bold;
    text-align: center;
    display: block;
    margin-bottom: 30px;
    position: relative;
}
article h2:after {
    content: "";
    background: #034679;
    display: block;
    height: 2px;
    width: 60px;
    margin-left: -30px;
    position: absolute;
    left: 50%;
    bottom: -7px;
}
article h2 span {
    font-size: 12px;
    line-height: 1.7;
    font-weight: normal;
    display: block;
    width: 100%;
    padding: 0 25px;
    box-sizing: border-box;
    position: absolute;
    top: 45px;
}



/* -- function
-------------------------------------------------------------------------------- */
#function {
    padding: 0 10px 30px;
}
#function h2 + span {
    text-align: center;
    display: block;
    height: 160px;
    margin: 105px auto 0;
    position: relative;
    overflow: hidden;
}
#function h2 + span img {
    width: auto;
    height: 160px;
    margin: auto;
    position: absolute;
    left: -100%;
    right: -100%;
}
#function section {
    padding: 30px 0 40px;
}
#function section h3 {
    font-size: 16px;
    margin-bottom: 25px;
}
#function section p {
    line-height: 1.64;
}
#function section p span {
    font-size: 12px;
    margin: 25px 0 30px;
    display: block;
}
#function section ul {
    display: block;
}
#function section ul li {
    line-height: 1.64;
    background: #FAFAFA;
    text-align: center;
    margin-bottom: 20px;
    padding: 30px 0;
    position: relative;
}
#function section ul li img {
    display: block;
    width: 210px;
    height: auto;
    margin: 0 auto 30px;
}
#function section ul li span {
    font-size: 10px;
    position: absolute;
    left: 50%;
    top: 85px;
    margin-left: 105px;
}
#function > h3 {
    font-size: 16px;
    line-height: 1.68;
    font-weight: normal;
    color: #FFF;
    background: #034679;
    text-align: center;
    display: block;
    padding: 10px;
    margin-bottom: 35px;
}
#function > ul li {
    display: block;
    padding-top: 45px;
    overflow: hidden;
}
#function > ul li img {
    width: 100%;
    margin-bottom: 30px;
}
#function > ul li h4 {
    font-size: 16px;
    margin-bottom: 25px;
}
#function > ul li p {
    line-height: 1.68;
    text-align: left;
}



/* -- scene
-------------------------------------------------------------------------------- */
#scene {
    background: #FAFAFA;
    padding: 80px 10px 30px;
}
#scene > ul {
    display: block;
    margin: 120px auto 0;
}
#scene > ul li {
    display: block;
    margin-bottom: 45px;
}
#scene > ul li img {
    width: 50%;
}
#scene > ul li h3 {
    font-size: 16px;
    line-height: 1.33;
    padding: 30px 0 25px;
}
@media screen and (max-width: 374px) {
    #scene h2 {
        margin: 0 10px 60px;
    }
    #scene h2 span {
        top: 73px;
    }
}
#scene > ul li p {
    font-size: 14px;
    line-height: 1.64;
    text-align: left;
    margin: 0 5px;
}
#scene section h3 {
    font-size: 18px;
    font-weight: normal;
    height: 33px;
    width: 180px;
    padding-top: 15px;
    margin: 0 auto 40px;
    position: relative;
}
#scene section h3:before,
#scene section h3:after {
    content: "";
    display: block;
    height: 48px;
    width: 7px;
    border: 1px solid #000;
    position: absolute;
    top: 0;
}
#scene section h3:before { border-right: none; left: 0; }
#scene section h3:after { border-left: none; right: 0; }
#scene section div {
    padding: 0 0 45px;
}
#scene section div img {
    width: 100%;
}
#scene section div h4 {
    font-size: 16px;
    line-height: 1.68;
    margin: 25px 0;
}
#scene section div p {
    text-align: left;
    line-height: 1.64;
    margin: 0 5px;
}



/* -- faq
-------------------------------------------------------------------------------- */
#faq {
    padding: 80px 10px;
}

#faq dd span.txt_l{
    text-decoration: underline;
    color: #034679;
}


/* -- flow
-------------------------------------------------------------------------------- */
#flow {
    padding: 0 10px 30px;
}
#flow ol {
    display: block;
    margin-top: 75px;
}
#flow ol li {
    display: block;
    padding-bottom: 45px;
}
#flow ol li span {
    font: 400 30px Montserrat, sans-serif;
    color: #FFF;
    display: block;
    padding: 20px 0;
}
#flow ol li:nth-child(1) span { background: #97BCD7; }
#flow ol li:nth-child(2) span { background: #74B4E4; }
#flow ol li:nth-child(3) span { background: #3485C2; }
#flow ol li:nth-child(4) span { background: #034679; }
#flow ol li:nth-child(5) span { background: #113550; }
#flow ol li span i {
    font-size: 35px;
}
#flow ol li h3 {
    font-size: 16px;
    line-height: 1.3;
    padding: 25px 0;
}
#flow ol li:nth-child(1) h3 { color: #97BCD7; }
#flow ol li:nth-child(2) h3 { color: #74B4E4; }
#flow ol li:nth-child(3) h3 { color: #3485C2; }
#flow ol li:nth-child(4) h3 { color: #034679; }
#flow ol li:nth-child(5) h3 { color: #113550; }
#flow ol li p {
    line-height: 1.64;
    text-align: left;
    margin: 0 5px;
}