@charset "utf-8";

body,input,select,textarea{font-family:'roboto','nsans','メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',Osaka,sans-serif;color:#212121;font-size: 16px;line-height: 2;}
    @media only screen and (max-width:767px)    {body,input,select,textarea{font-size: 14px;line-height: 1.75;}}

body{min-width:100%;background: #fff;}

::selection {background:#005ec2;color:#fff;}
::-moz-selection {background:#005ec2;color:#fff;}

body a,body a:hover{text-decoration:none;color:#333;}
body a:hover,body a:active,body a:focus{opacity:1;}
body a,body a:hover,body a:active,body a:focus{outline:0;}

.text-link,.text-link:hover,.text-link:active,.text-link:focus{color:#005ec2;text-decoration: underline;}
.text-link:hover,.text-link:active,.text-link:focus{color:#005ec2;text-decoration: none;}

.img-hover:hover img,.img-hover:active img,.img-hover:focus img{opacity:.75;}

/* header */
#hd-menu{}

.hd-contact{display: flex;justify-content:flex-end;align-items:center;}
	@media only screen and (max-width:991px)	{.hd-contact{display: none;}}

.hd-tel{color:#212121;}

.hd-mail,.hd-instagram{margin-left: 15px;}

.ax-hd,a.ax-hd:hover,a.ax-hd:active,a.ax-hd:focus{background: #005ec2;color:#fff;font-size: 16px;width: 32px;line-height: 32px;border-radius:30px;display: block;padding: 0;text-align: center;}


/* footer */
.footer-recruit{border: 1px solid #fff;padding:24px 19px;position: relative;}
    @media only screen and (max-width:991px)    {.footer-recruit{padding:24px 19px;}}
    @media only screen and (max-width:767px)    {.footer-recruit{padding:19px 14px;}}

.footer-recruit:before{content: "";display: block;background: url(../images/cmn/footer-recruit.jpg) center center /cover no-repeat;position: absolute;top: 0;left: 0;right: 0;bottom: 0;opacity:.5;}

.footer-recruit *{position: relative;z-index: 1;}

.footer-recruit h4{text-align: center;font-size: 21px;margin-bottom: 20px;border-bottom: 1px solid #fff;padding-bottom: 15px;}
    @media only screen and (max-width:767px)    {.footer-recruit h4{font-size: 16px;}}




/* index */
.content-box{position: relative;width: 100%;display: flex;}

.title-left{padding-left: 155px;}
.title-right{padding-right: 155px;}
    @media only screen and (max-width:1199px)    {
        .title-left{padding-left: 125px;}
        .title-right{padding-right: 125px;}
    }
    @media only screen and (max-width:991px)    {
        .title-left{padding-left: 95px;}
        .title-right{padding-right: 95px;}
    }
    @media only screen and (max-width:767px)    {
        .title-left{padding-left: 80px;}
        .title-right{padding-right: 80px;}
    }
    @media only screen and (max-width:575px)    {
        .title-left{padding-left: 50px;}
        .title-right{padding-right: 50px;}
    }


.content-title{position: absolute;top: 0;bottom: 0;width: 54px;display: flex;align-items:center;}
    @media only screen and (max-width:1199px)   {.content-title{width: 45px;}}
    @media only screen and (max-width:991px)    {.content-title{width: 33.75px;}}
    @media only screen and (max-width:767px)    {.content-title{width: 22.5px;}}
    @media only screen and (max-width:575px)    {.content-title{align-items:flex-start;}}


.title-left:before{content: ""; border-left: 5px solid #005ec2;position: absolute;top: 0;bottom: 0;left: 90px;}
.title-right:before{content: ""; border-left: 5px solid #005ec2;position: absolute;top: 0;bottom: 0;right: 90px;}
    @media only screen and (max-width:1199px)   {
        .title-left:before{left: 75px;}
        .title-right:before{right: 75px;}
    }
    @media only screen and (max-width:991px)   {
        .title-left:before{left: 60px;}
        .title-right:before{right: 60px;}
    }
    @media only screen and (max-width:767px)   {
        .title-left:before{left: 45px;}
        .title-right:before{right: 45px;}
    }
    @media only screen and (max-width:575px)   {
        .title-left:before{left: 30px;}
        .title-right:before{right: 30px;}
    }



.title-left .content-title{left: 0;}
.title-right .content-title{right: 0;}

.content-title .tit-level0{writing-mode: vertical-rl;-ms-writing-mode: tb-rl;-webkit-writing-mode: vertical-rl;}



.content-txt{width: 100%;}






.sec-pat1{background: url(../images/cmn/pattern1.png) center center;}

.sec-pat2{background: url(../images/cmn/pattern2.png) center center;color:#fff;}


.sec-ssc{padding: 0;}



.ssc-box{position: relative;z-index: 1;width: 100%;display: block;}

.bg-ssc{overflow: hidden;}
    @media only screen and (max-width:1199px)   {.bg-ssc{}}
    @media only screen and (max-width:991px)    {.bg-ssc{}}
    @media only screen and (max-width:767px)    {.bg-ssc{}}
    @media only screen and (max-width:575px)    {.bg-ssc{}}


a.anchor-jump{width: 100%;}

a.anchor-jump .thar {
    transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}
a.anchor-jump:hover .thar {
}
a.anchor-jump:hover .thar:before {
    left: 0%;
    right: auto;
    width: 100%;
}
a.anchor-jump .thar:before {
    content: '';
    width: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    background:rgba(0,94,194,.25);
    transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
    z-index: 1;
}

.goto{width: 100%;display: flex;}

.sec-prf .goto,.sec-rcr .goto{justify-content:flex-start;}
.sec-srv .goto{justify-content:flex-end;}

.goto .ax-text-link{flex: 1 1 33%;max-width: 33%;}
    @media only screen and (max-width:1199px)   {.goto .ax-text-link{flex:1 1 50%;max-width: 50%;}}
    @media only screen and (max-width:575px)    {.goto .ax-text-link{flex:1 1 100%;max-width: 100%;}}



.ax-text{background: linear-gradient(to right, #af8d5d 0%,#876a47 100%);padding: 15px 30px;color:#fff;text-align: center;position: relative;z-index: 2;white-space: nowrap;}
    @media only screen and (max-width:767px)    {.ax-text{padding: 5px 10px;}}


.anchor-jump:hover .ax-solid,.anchor-jump:active .ax-solid,.anchor-jump:focus .ax-solid    {background: #005ec2;color:#fff !important;opacity:1 !important;}




.anchor-jump .bg-ssc > img{transform:scale(1);transition:.3s;transition-timing-function:ease-in-out;}
.anchor-jump:hover .bg-ssc > img{transform:scale(1.05);transition:.3s;transition-timing-function:ease-in-out;}

.ssc-text{position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: 2;text-align: center;background: rgba(0,0,0,.375);padding: 15px;color:#fff;font-size: 18px;text-indent:.1em;display: flex;justify-content:center;align-items:center;}
    @media only screen and (max-width:1199px)   {.ssc-text{padding: 45px 15px;}}
    @media only screen and (max-width:991px)    {.ssc-text{font-size: 16px;padding: 45px 15px;}}
    @media only screen and (max-width:767px)    {.ssc-text{font-size: 15px;padding: 30px 15px;}}


.works-container{overflow: hidden;}






.ssc-srv{display: block;padding: 33px;position: relative;transform:scale(1);transition:.3s;}
    @media only screen and (max-width:991px)    {.ssc-srv{margin: 0 0 135px;}}
    @media only screen and (max-width:767px)    {.ssc-srv{padding: 25px;margin: 0 0 135px;}}

.ssc-srv:hover,.ssc-srv:active,.ssc-srv:focus{transform:scale(1.05);transition:.3s;}

.ssc-srv1,.ssc-srv2,.ssc-srv3,.ssc-srv4{width: 160px;height: 160px;transform:rotate(45deg);overflow: hidden;display: flex;justify-content:center;align-items:center;position: relative;z-index: 1;}
    @media only screen and (max-width:991px)    {.ssc-srv1,.ssc-srv2,.ssc-srv3,.ssc-srv4{margin: 0 auto 30px;}}
    @media only screen and (max-width:767px)    {.ssc-srv1,.ssc-srv2,.ssc-srv3,.ssc-srv4{width: 120px;height: 120px;margin: 0 auto 20px;}}

.ssc-srv1:before,.ssc-srv2:before,.ssc-srv3:before,.ssc-srv4:before{content: "";position: absolute;top: -25%;left: -25%;right: -25%;bottom: -25%;transform:rotate(-45deg);}

.ssc-srv1:before{background: url(../images/ssc-srv1.jpg) center center /cover no-repeat;}
.ssc-srv2:before{background: url(../images/ssc-srv2.jpg) center center /cover no-repeat;}
.ssc-srv3:before{background: url(../images/ssc-srv3.jpg) center center /cover no-repeat;}
.ssc-srv4:before{background: url(../images/ssc-srv4.jpg) center center /cover no-repeat;}

.ssc-srv1 strong,.ssc-srv2 strong,.ssc-srv3 strong,.ssc-srv4 strong{background: rgba(0,0,0,.75);color:#fff;transform:rotate(-45deg);font-weight: normal;padding:5px 15px;}
    @media only screen and (max-width:767px)    {.ssc-srv1 strong,.ssc-srv2 strong,.ssc-srv3 strong,.ssc-srv4 strong{padding:5px 10px;}}

.ssc-srv p{position: absolute;top: 0;left: 113px;right: 0;bottom: 0;color:#fff;display: flex;align-items:center;line-height: 1.75;background: linear-gradient(to right,  rgba(68,13,36,1) 0%,rgba(68,13,36,0) 100%);padding: 30px 0;padding-left: 135px;}
    @media only screen and (max-width:991px)    {.ssc-srv p{top: 113px;left: 0;display: block;background: linear-gradient(to bottom, rgba(68,13,36,1) 0%,rgba(68,13,36,0) 100%);padding: 0 30px;padding-top: 135px;}}
    @media only screen and (max-width:767px)    {.ssc-srv p{top: 85px;padding: 0 15px;padding-top: 105px;}}


.bg-idx-contact{background: url(../images/idx-cnt1.jpg) center center /cover no-repeat;position: relative;color:#fff;padding: 75px 0;margin-bottom: -75px;}
    @media only screen and (max-width:1199px)   {.bg-idx-contact{padding: 60px 0;margin-bottom: -60px;}}
    @media only screen and (max-width:991px)    {.bg-idx-contact{padding: 45px 0;margin-bottom: -45px;}}
    @media only screen and (max-width:767px)    {.bg-idx-contact{padding: 30px 0;margin-bottom: -30px;}}

.bg-idx-contact:before{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,.5);}

.bg-idx-contact h3{font-size: 24px;text-align: center;line-height: 1.75;margin-bottom: 30px;}
    @media only screen and (max-width:991px)    {.bg-idx-contact h3{font-size: 21px;}}
    @media only screen and (max-width:767px)    {.bg-idx-contact h3{font-size: 18px;}}
    @media only screen and (max-width:575px)    {.bg-idx-contact h3{font-size: 15px;}}

.bg-idx-contact [data-action="call"],.bg-idx-contact a,.bg-idx-contact a:hover,.bg-idx-contact a:active,.bg-idx-contact a:focus{color:#fff;}




.alert,.well{width: 100%;margin: 20px 0;padding: 19px;}

.alert:first-child,.well:first-child{margin-top: 0;}
.alert:last-child,.well:last-child{margin-bottom: 0;}


.well{background: #f6f6f6;padding: 19px;border: 1px solid #ddd;border-radius:.4rem;}

.alert-lg{padding: 29px;font-size: 1.1em;font-weight: bold;}


.flex-center{display: flex;justify-content: center;align-items: center;text-align: center;padding: 29px 9px;}
	@media only screen and (max-width:1199px)	{.flex-center{padding: 19px 9px;}}
	@media only screen and (max-width:575px)	{.flex-center{padding: 9px 4px;}}


.flex-center small{display: block;}




.cat-box{display: flex;flex-flow:column-reverse nowrap;}

.cat-box h4{border-bottom: 2px solid #212121;padding: 10px 0 20px;font-size: 16px;font-weight: bold;}
    @media only screen and (max-width:767px)    {.cat-box h4{padding: 10px 0 15px;font-size: 14px;}}


.img-item{}


.cat-dt-box{}

.tit-cat-dt{border-bottom: 2px solid #212121;padding: 10px 0 20px;font-size: 16px;font-weight: bold;}
    @media only screen and (max-width:767px)    {.tit-cat-dt{padding: 10px 0 15px;font-size: 14px;}}


.ba-box{margin: 30px 0;padding: 30px;}
    @media only screen and (max-width:767px)    {.ba-box{margin: 15px 0;padding: 15px;}}


/* main */
.bg-orange{background: #f4b373;}
.bg-blue{background-color: #9bb8ea;}
.bg-pink{background: #e88989;}
.bg-leaf{background: #99e083;}



.bg-gray{background: url(../images/cmn/washi-hakuji.jpg) center center;}
.bg-gray:first-child{}
.bg-gray:last-child{}

.bg-lightgray{background: #dfe8ec;}

.bg-pale{background: #f5f5f5;}

.bg-white{background:#fff;color:#09c !important;}
.bg-silver{background: #f6f6f6;}


.bg-sky{background-color: #9fd4e5;}
.bg-water{background: #d5ecf3;}

.bg-green{background: #005ec2;}
.bg-eco-green{background-image: linear-gradient(to bottom, #68aa41 0%,#d1e7c4 100%);color:#fff;}
.bg-applegreen{background:#f90;color:#fff;}

.bg-ivory{background:#fcfbf3;}
.bg-canary{background:#f3f3d7;}


.bg-cherry{background:#f7b7c5;}


/* text */
.text-navy{color:#005ec2;}





/* marker */
.marker-green	{background:linear-gradient(transparent 60%, #99dacb 0%);}
.marker-blue	{background:linear-gradient(transparent 60%, #bdf 0%);}
.marker-orange	{background:linear-gradient(transparent 60%, #fc3 0%);}
.marker-pink	{background:linear-gradient(transparent 60%, #fcc 0%);}
.marker-yellow	{background:linear-gradient(transparent 60%, #fff262 0%);}



.signature{font-family: 'nserif',serif;margin-top: 10px;font-size: 18px;}