@charset "UTF-8";
/*!職る人 ⼯房訪問篇用スタイル*/
#content2{overflow:hidden}
.heroimg .bg{-webkit-animation-duration:16s;animation-duration:16s}
.heroimg .bg_01{background-image:url(../img/visit/heroimg_01.jpg);-webkit-animation-delay:-3s;animation-delay:-3s}
.heroimg .bg_02{background-image:url(../img/visit/heroimg_02.jpg);-webkit-animation-delay:5s;animation-delay:5s}
.article{position:relative;background:url(../img/common/map.png) no-repeat 50% 0;}
.section{position:relative}
.section_heading{font-family:"游明朝体","Yu Mincho",YuMincho,serif;font-weight:700;text-align:center}
.section_heading::after{content:"";display:block;height:1px;margin:0 auto;background-color:#333}
.section .txt .mdash{margin-right:.2em;margin-left:.2em}
.section .txt .mdash::before{content:"——";font-family:serif}
.em_area{position:relative;padding-top:1px}
.em_area .bg{position:absolute;left:50%;width:100%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%)}
.em_area .bg .inner{position:absolute;display:block;height:0;background-color:#f4f3ed;z-index:-1}
.em_area .txt{position:relative;background-color:#fff;-webkit-box-sizing:border-box !important;box-sizing:border-box !important;}
.layout{position:relative}
#section_01 .layout .txt{align-self: auto;}
#section_02 .em_area .bg .inner{top:0}
#section_02 .imgs{position:relative}
#section_03 .imgs{position:relative}
#section_04 .section_header{background:url(../img/visit/bg_s3_header.jpg) no-repeat 50% 50%;background-size:cover;font-family:"游明朝体","Yu Mincho",YuMincho,serif;letter-spacing:.25em}
#section_04 .section_header .inner{position:relative}
#section_04 .section_header .section_04_heading {position: relative}
#section_04 .section_header .row{position:relative;display:inline-block}
#section_04 .section_header .row::before{content:"";position:absolute;left:calc(50% - 1em);top:0;display:block;width:2em;height:100%}
#section_04 .section_header .row::before{background-color:#fff}
#section_04 .section_header .row .inner{position:relative;display:inline-block;padding:1em 0}
#section_04 .section_header .row.animated{opacity:1}
#section_04 .section_header .row.animated::before{opacity:0;-webkit-transition:opacity;-o-transition:opacity;transition:opacity}
#section_04 .section_header .row.animated::after{content:"";position:absolute;left:calc(50% - 1em);top:0;display:block;width:2em;height:0;background-color:#f4f3ed}
#section_04 .section_header .row.animated .inner{opacity:0;-webkit-transition:opacity;-o-transition:opacity;transition:opacity}
#section_04 .section_header .row.show::before{opacity:1;-webkit-transition-delay:.6s;-o-transition-delay:.6s;transition-delay:.6s}
#section_04 .section_header .row.show::after{-webkit-animation:text-bg 1.5s cubic-bezier(.645,.045,.355,1);animation:text-bg 1.5s cubic-bezier(.645,.045,.355,1)}
#section_04 .section_header .row.show .inner{opacity:1;-webkit-transition-delay:.6s;-o-transition-delay:.6s;transition-delay:.6s}
#section_04 .em_area .bg .inner{top:0}
#section_04 .imgs{position:relative}
#section_04 .imgs::before{content:"";display:block;width:100%;height:0;padding-top:63.88%}
#section_04 .imgs .img{position:absolute}
#section_04 .img_01{top:0;left:0;width:33.39%}
#section_04 .img_02{top:0;left:33.3%;width:33.3%}
#section_04 .img_03{top:0;left:66.52%;width:47.275%}
#section_04 .img_04{top:36%;width:73.42%}
#section_04 .img_05{top:36%;right:0;width:40.378%}
#section_04 .combine{padding-left:5px;padding-bottom:6px}
#section_04 .point_part{position: relative;padding-left: 1.8em;margin-top: 2em;}
#section_04 .point_part li+li{padding-top:8px;}
#section_04 .point_part span{position: absolute;left: 0;}
.next{position:relative;font-family:"游明朝体","Yu Mincho",YuMincho,serif;text-align:center}
.next::after{content:"";display:block;width:1px;margin:10px auto 0;background-color:#333}
.article_info{text-align:right}
.next_banner{background-image:url(../img/visit/bg_next.jpg)}
.next_banner .title .mdash:before{content: "——";font-family: serif;}

@media print,screen and (min-width:768px){/*!職る人 ⼯房訪問篇用スタイル*/
.section+.section{margin-top:120px}
.section_heading{margin-bottom:30px;font-size:1.5em;line-height:1.58}
.section_heading::after{width:80px;margin-top:20px}
.section p{line-height:187.5%}
.section p+p{margin-top:2em}
.em_area{max-width:1500px;margin:0 auto}
.em_area .bg{max-width:1174px;margin:0 auto}
.em_area .img{position:absolute;width:62.67%;max-width:940px}
.em_area .txt{width:41.33%;padding:4.67%}
.layout{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
.layout .txt{-ms-flex-preferred-size:46.68%;flex-basis:46.68%;-ms-flex-item-align:center;align-self:center}
.layout .img{-ms-flex-preferred-size:50%;flex-basis:50%;-ms-flex-negative:0;flex-shrink:0}
.layout_r{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}
#section_01 .em_area .bg .inner{right: 25%;margin-top: 23.65%;padding-top: 77.6%;width: 100vw;margin-left: calc(50% - 50vw);}
#section_01 .em_area .img{top:-5px;left:50%;-webkit-transform:translateX(-20.21%);-ms-transform:translateX(-20.21%);transform:translateX(-20.21%)}
#section_01 .em_area .txt{margin-left:6%;margin-top:13.8%}
#section_01 .layout{margin-top:110px}
#section_02{margin-top: 150px;}
#section_02 .em_area .img{top:0;left:50%;-webkit-transform:translateX(-20.21%);-ms-transform:translateX(-20.21%);transform:translateX(-20.21%)}
#section_02 .em_area .txt{margin-left:6%;margin-top:6.2%}
#section_02 .imgs{margin-top:110px;padding-top:18.57%}
#section_02 .imgs .img{width:50%;-ms-flex-negative:0;flex-shrink:0}
#section_02 .img_01{position:absolute;top:0;left:0}
#section_02 .img_02{position:relative;margin:0 9.37% 0 auto}
#section_02 .txt.elem_text{margin: 55px 0 60px;}
#section_03{margin-top: 45px;}
#section_03 .em_area .txt {margin: 0 6.37% 0 auto;margin-top: 13.5%}
#section_03 .container .imgs{margin-top:0}
#section_03 .imgs{padding-top:18.57%;margin-top: 108px;}
#section_03 .imgs .img{width:50%;-ms-flex-negative:0;flex-shrink:0}
#section_03 .img_01{position:absolute;top:0;left:0}
#section_03 .img_02{position:relative;margin:0 9.37% 0 auto}
#section_03 .txt.elem_text{margin: 75px 0 60px;}
#section_03 .em_area .container+.img{margin-top: 100px}
#section_03 .em_area .bg .inner {margin-top: 3%;padding-top: 62.2%;left: 0%;width: 100vw;margin-right: calc(50% - 50vw);}
#section_04{margin-top: 100px;}
#section_04 .section_header{height:510px;margin-bottom:75px;font-size:1.5em;line-height:3.47}
#section_04 .section_header .section_04_heading{top:-4.5em}
#section_04 .em_area{margin-top:99px}
#section_04 .em_area.ad_mt{margin-top:200px}
#section_04 .em_area:nth-of-type(4) {margin-top:100px}
#section_04 .em_area:nth-of-type(4) .txt {margin-top: 12.45%;}
#section_04 .em_area .bg .inner{left:25%;margin-top:27.5%;padding-top:82.3%;width: 100vw;margin-right: calc(50% - 50vw);}
#section_04 .em_area .img{top:0;right:50%;-webkit-transform:translateX(20.21%);-ms-transform:translateX(20.21%);transform:translateX(20.21%)}
#section_04 .em_area .txt{margin: 5.5% 6.5% 0 auto;padding: 5% 4% 4.5% 5%;}
#section_04 .layout{margin-top:110px}
#section_04 .layout+.layout{margin-top:72px}
#section_04 .layout .txt{align-self: flex-start;}
#section_04 .imgs{margin-top:140px;margin-bottom:95px}
#section_04 .img_04{right:40.2%}
.next{margin-top:40px;font-size:1.13em}
.next::after{height:70px}
.article_info{margin-top:30px;font-size:.88em}
.article_info li+li{margin-top:5px}
}
@media only screen and (max-width:767px){/*!職る人 ⼯房訪問篇用スタイル*/
.heroimg .bg_02{background-image:url(../img/visit/heroimg_02_sp.jpg)}
.article{background-size: 220% auto;background-position: 50% -0.01%}
.section+.section{margin-top:40px}
.section_heading{margin-bottom:15px;font-size:1.36em;line-height:1.61}
.section_heading::after{width:40px;margin-top:15px}
.section p{line-height:182.14%}
.section p+p{margin-top:1.7em}
.section .txt{margin-right:20px;margin-left:20px}
.em_area .img{position:relative}
.em_area .txt{margin:-30px 20px 0;padding:35px 20px 20px}
.layout .img{width:87.5%}
#section_01 .em_area .bg{bottom:15%}
#section_01 .em_area .bg .inner{width:79.73%;padding-top:97.67%;right: 0}
#section_01 .layout{margin-top:30px}
#section_01 .layout .txt{margin-top:30px}
#section_01 .container + .container .img{margin-left: auto;}
#section_03{margin-top:0}
#section_03 .em_area .bg{bottom:73%}
#section_03 .em_area .bg .inner{width:86.8%;padding-top:95.33%;left:0;top:30px}
#section_03 .container+.img{margin-top:40px}
#section_03 .imgs{margin:30px -20px 0}
#section_03 .imgs .img{width:76.56%}
#section_03 .img_02{margin-top:25px;margin-left:auto}
#section_03 .txt.elem_text{margin: 37px 0 30px;}
#section_04{margin-top:90px}
#section_04 .point_part{margin-top: 1em;}
#section_04 .point_part li+li{padding-top:8px;}
#section_04 .section_header{margin-left:auto;margin-bottom:30px;padding-right:25px;line-height:3.44}
#section_04 .section_header .section_04_heading{top:-4em}
#section_04 .em_area{margin-top:30px}
#section_04 .em_area .bg{top:7%}
#section_04 .em_area .bg .inner{width:80%;padding-top:180%;right:0;top:100px}
#section_04 .layout{margin-top:30px}
#section_04 .layout .txt{margin-top:30px}
#section_04 .layout.layout_r .img{margin-left:auto}
#section_04 .imgs{margin:30px -20px 30px}
#section_04 .img_04{right:35%}
.next{margin-top:50px;font-size:1.14em}
.next::after{height:50px}
.article_info{margin-top:30px;font-size:.86em}
.article_info li+li{margin-top:3px}
.next_banner{background-image:url(../img/visit/bg_next_sp.jpg)}
sup{top: -0.2em}
}
@-webkit-keyframes slide-anim{0%{opacity:0;-webkit-transform:scale(1) rotate(0.1deg);transform:scale(1) rotate(0.1deg)}
31.25%{opacity:1}
50%{opacity:1}
62.5%{opacity:0}
100%{opacity:0;-webkit-transform:scale(1.16);transform:scale(1.16)}
}
@keyframes slide-anim{0%{opacity:0;-webkit-transform:scale(1) rotate(0.1deg);transform:scale(1) rotate(0.1deg)}
31.25%{opacity:1}
50%{opacity:1}
62.5%{opacity:0}
100%{opacity:0;-webkit-transform:scale(1.16);transform:scale(1.16)}
}
