@charset "utf-8";

/* .section */
.section {
    padding:120px 0;
}

.section h4 {
    word-break:keep-all;
    font-weight:bold;
    font-size:40px;
    line-height:60px;
}

.section h5 {
    word-break:keep-all;
    font-weight:bold;
    font-size:25px;
}

.section p.title {
    display:inline-block;
    padding:5px 20px;
    margin-bottom:20px;
    border:1px solid var(--MainColor);
    border-radius:30px;
    font-weight:bold;
    font-size:18px;
    line-height:30px;
    color:var(--MainColor);
}

/* #home */
#home {
    padding:400px 0;
    background:url(../images/bg/bg_home.png) no-repeat 50% 50%;
    background-size:cover;
    color:var(--MainBackColor);
    text-align:center;
}

#home img {
    width:180px;
}

#home h3 {
    font-weight:bold;
    font-size:45px;
    line-height:80px;
    word-break:keep-all;
}

#home h3 span {
    display:block;
    font-size:50px;
}

#home ul {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    width:400px;
    margin:50px auto 0;
}

#home ul li {
    padding:0 10px;
}

#home ul li a {
    display:inline-block;
    width:180px;
    height:50px;
    line-height:44px;
    border-radius:30px;
    font-weight:bold;
    font-size:16px;
    color:var(--MainBackColor);
    -webkit-transition:.5s;
    -moz-transition:.5s;
    -ms-transition:.5s;
    -o-transition:.5s;
    transition:.5s;
}

#home ul li:nth-child(1) a {
    border:3px solid var(--MainColor);
    background-color:var(--MainColor);
}

#home ul li:nth-child(2) a {
    border:3px solid var(--MainFontColor);
    background-color:var(--MainFontColor);
}

#home ul li:nth-child(1) a:hover {
    background-color:var(--MainBackColor);
    color:var(--MainColor);
}

#home ul li:nth-child(2) a:hover {
    background-color:var(--MainBackColor);
    color:var(--MainFontColor);
}

#home ul li a.call_pc {
    display:block;
}

#home ul li a.call_m {
    display:none;
}

/* #intro */
#intro {
    text-align:center;
    background:url(../images/bg/bg_intro.png) no-repeat 50% 50%;
    background-size:cover;
}

#intro h4 {
    margin-top:30px;
}

/* #service */
#service .row {
    margin-top:80px;
}

#service .row:first-child {
    margin-top:0;
}

#service .row.cross {
    display:flex;
    flex-direction:row-reverse;
}

#service .col-12 {
    text-align:center;
}

#service .col-lg-6 {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
}

#service .col-lg-6 .thumb {
    width:83%;
    border-radius:15px;
    overflow:hidden;
    box-shadow:0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}

#service .col-lg-6 .thumb img {
    -webkit-transform:scale(1);
    -moz-transform:scale(1);
    -ms-transform:scale(1); 
    -o-transform:scale(1);  
    transform:scale(1);
    -webkit-transition:.5s;
    -moz-transition:.5s;
    -ms-transition:.5s;
    -o-transition:.5s;
    transition:.5s;
}

#service .row:hover .col-lg-6 .thumb img {
    -webkit-transform:scale(1.05);
    -moz-transform:scale(1.05);
    -ms-transform:scale(1.05);   
    -o-transform:scale(1.05);
    transform:scale(1.05);
}

#service .col-lg-6 .cont p {
    margin-top:10px;
    font-size:16px;
    word-break:keep-all;
    color:var(--SubFontColor);
}

#service .row:nth-child(2) .col-lg-6 .cont ul {
    margin-top:30px;
}

#service .row:nth-child(2) .col-lg-6 .cont ul li {
    position:relative;
    margin-top:15px;
}

#service .row:nth-child(2) .col-lg-6 .cont ul li::before {
    position:absolute;
    left:0;
    top:2px;
    content:'';
    display:inline-block;
    width:25px;
    height:25px;
    background:url(../images/service/icon_check.png) no-repeat 50% 50%;
    background-size:100%;
}

#service .row:nth-child(2) .col-lg-6 .cont ul li dl {
    padding-left:35px;
}

#service .row:nth-child(2) .col-lg-6 .cont ul li dl dt {
    font-size:18px;
    color:var(--MainColor);
}

#service .row:nth-child(2) .col-lg-6 .cont ul li dl dd {
    margin-top:5px;
    font-size:15px;
    word-break:keep-all;
    color:var(--SubFontColor);
}

#service .row:nth-child(2) .col-lg-6 .cont ul li dl dd span {
    font-weight:bold;
    color:var(--MainFontColor);
}

#service .row:nth-child(4) .col-lg-6 .cont ul {
    margin-top:30px;
}

#service .row:nth-child(4) .col-lg-6 .cont ul li {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    padding:20px 0;
    border-bottom:1px solid var(--BorderColor);
}

#service .row:nth-child(4) .col-lg-6 .cont ul li:last-child {
    border-bottom:0 none;
}

#service .row:nth-child(4) .col-lg-6 .cont ul li .icon {
    width:150px;
    height:150px;
    border-radius:50%;
    background-color:var(--MainColor);
    box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}

#service .row:nth-child(4) .col-lg-6 .cont ul li dl {
    width:calc(100% - 150px);
    padding-left:30px;
}

#service .row:nth-child(4) .col-lg-6 .cont ul li dl dt {
    font-size:20px;
    color:var(--MainColor);
}

#service .row:nth-child(4) .col-lg-6 .cont ul li dl dd {
    margin-top:10px;
    font-size:16px;
    word-break:keep-all;
    color:var(--SubFontColor);
}

/* #consulting */
#consulting {
    background:url(../images/bg/bg_consulting.png) no-repeat 30% 50%;
    background-size:cover;
    color:var(--MainBackColor);
    text-align:center;
}

#consulting h4 {
    margin-bottom:50px;
}

#consulting .col-lg-3 {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    margin-top:30px;
}

#consulting .col-lg-3 .box {
    width:100%;
    height:100%;
    padding:30px;
    border:2px solid rgba(255,255,255,0.5);
    border-radius:15px;
    text-align:left;
    -webkit-transition:.5s;
    -moz-transition:.5s;
    -ms-transition:.5s;
    -o-transition:.5s;
    transition:.5s;
}

#consulting .col-lg-3:hover .box {
    transform:translateY(-10px);
}

#consulting .col-lg-3 .box p {
    height:50px;
    margin:10px 0 30px;
    line-height:25px;
    word-break:keep-all;
}

#consulting .col-lg-3 .box img {
    display:block;
    width:80px;
    height:80px;
    margin-left:auto;
}

#consulting .col-12 p {
    margin:50px 0 30px;
    font-size:18px;
    word-break:keep-all;
}

#consulting .col-12 div a {
    display:inline-block;
    width:180px;
    height:50px;
    line-height:44px;
    border:3px solid var(--MainColor);
    border-radius:30px;
    background-color:var(--MainColor);
    color:var(--MainBackColor);
    font-weight:bold;
    font-size:18px;
    -webkit-transition:.5s;
    -moz-transition:.5s;
    -ms-transition:.5s;
    -o-transition:.5s;
    transition:.5s;
}

#consulting .col-12 div a:hover {
    background-color:var(--MainBackColor);
    color:var(--MainColor);
}

#consulting .col-12 div a.call_pc {
    display:inline-block;
}

#consulting .col-12 div a.call_m {
    display:none;
}

/* #qna */
#qna {
    text-align:center;
}

#qna ul {
    margin-top:50px;
}

#qna ul li {
    text-align:left;
}

#qna ul li dt {
    position:relative;
    font-size:17px;
    line-height:20px;
    border-bottom:1px solid var(--BorderColor);
}

#qna ul li:nth-child(1) dt {
    border-top:1px solid var(--BorderColor);
}

#qna ul li dt a {
    display:inline-block;
    width:100%;
    height:100%;
    padding:30px 30px 30px 35px;
    color:#222222;
    word-break:keep-all;
}

#qna ul li dt a span {
    position:absolute;
    left:15px;
    top:30px;
    font-weight:bold;
    color:var(--MainColor);
}

#qna ul li dt i {
    position:absolute;
    right:15px;
    top:30px;
    line-height:20px;
    color:var(--SubFontColor);
    -webkit-transition:.5s;
    -moz-transition:.5s;
    -ms-transition:.5s;
    -o-transition:.5s;
    transition:.5s;
}

#qna ul li.on dt i {
    transform:rotate(180deg);
}

#qna ul li.on dd {
    display:block;
}

#qna ul li dd {
    position:relative;
    display:none;
    padding:30px 15px;
    border-bottom:1px solid var(--BorderColor);
}

#qna ul li dd div {
    display:flex;
    flex-wrap:wrap;
}

#qna ul li dd div span {
    display:block;
    width:23px;
    font-weight:bold;
    font-size:17px;
    line-height:30px;
    color:var(--MainColor);
}

#qna ul li dd div p {
    width:calc(100% - 23px);
    line-height:30px;
    word-break:keep-all;
    color:var(--SubFontColor);
}

/* #directions */
#directions {
    text-align:center;
}

#directions h4 {
    margin-bottom:30px;
}

#directions p {
    margin-top:10px;
    font-weight:bold;
    font-size:18px;
    text-align:left;
    word-break:keep-all;
}