@charset "UTF-8";

/* CSS Document */
#container { padding-top: 40px;    /* padding-bottom: 12.5vw; */ }
a.arBt { position: relative; }
a.arBt::before { content: ''; display: block; position: absolute; left: 50%; bottom: 50%; -webkit-transform: translateY(25%); transform: translateY(25%); -webkit-transition: width 0.25s ease; transition: width 0.25s ease; }

/*=============================
main
=============================*/
#main { }
#main .copyArea { position: relative; min-height: 360px; width: 100%; overflow: hidden; }
#main .copyArea::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.2); z-index: 1; }
#main .copyArea video.movieBg { position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 0; }
#main .copyArea .inner { width: 100%; position: absolute; top: 50%; z-index: 2; margin-top: -0.4rem; }
#main .copyArea .inner .copy { text-align: center; font-size: 7.81vw; font-weight: bold; letter-spacing: 0.05em; color: #FFF; margin-bottom: 20vw; }
#main .copyArea .inner .logo { width: 23vw; margin-left: auto; margin-right: auto; border-bottom: 2px solid #FFF; padding-bottom: 2.34vw; }
#main .copyArea .inner .logo img { display: block; margin-left: auto; margin-right: auto; width: 100%; height: auto; }
#main #news { background: #e3e3e3; position: relative; }
#main #news .inner { padding: 3.91vw 2.34vw; -js-display: flex; display: -webkit-flex; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
#main #news .inner .icon { -ms-flex-preferred-size: 15.63vw; flex-basis: 15.63vw; background: #2ec448; text-align: center; padding: 8px 0; }
#main #news .inner .icon img { display: block; height: 2.81vw; width: auto; margin-left: auto; margin-right: auto; }
#main #news .newsList { padding-left: 2.34vw; -ms-flex-preferred-size: calc(100% - 15.63vw); flex-basis: calc(100% - 15.63vw); }
#main #news .newsList li:not(:last-child) { margin-bottom: 10px; }
#main #news .newsList li a { color: #2ec448; font-size: 3.91vw; font-weight: bold; line-height: 1.5; text-decoration: none; }
#main #news .newsList li a p { display: inline; }
#main #news .newsList li a p.data { }
#main #news .newsList li a p.txt { }
#main #news .inner .bt_archive { -ms-flex-preferred-size: 100%; flex-basis: 100%; height: 4.06vw; text-align: right; }
#main #news .inner .bt_archive a { display: inline-block; width: 16.5vw; height: 100%; border: 1px solid #000; position: relative; text-align: left; }
#main #news .inner .bt_archive a.arBt::before { margin-left: 4.5vw; width: 3.13vw; height: 0.8vw; background: url(../img/bt_arrow_b.svg) no-repeat bottom right/auto 100%; }
#main #news .inner .bt_archive a img { height: 2.50vw; width: auto; margin-left: 1.56vw; }
section .tit span { display: inline-block; border-bottom: 2px solid #000; padding-bottom: 1.56vw; }
section .tit img { height: 3.13vw; width: auto; }

/*=============================
message
=============================*/
#message { padding: 10.16vw 0 0; position: relative; margin-bottom: 15.63vw; }
#message .txtArea { margin-bottom: 12.5vw; }
#message .txtArea .titArea { padding: 2.34vw 0 2.34vw 50%; background: url(../img/top/message_ph01.jpg) no-repeat top left/48% auto; margin-bottom: 6.25vw; }
#message .txtArea .tit { margin-bottom: 3.91vw; }
#message .txtArea .copy { font-size: 6.25vw; letter-spacing: 0.05em; font-weight: bold; line-height: 1.5; }
#message .txtArea .txt { text-align: center; font-size: 4.38vw; letter-spacing: 0.05em; line-height: 1.5; margin-bottom: 3.91vw; }
#message .txtArea .bt_more { text-align: center; }
#message .txtArea .bt_more a { display: inline-block; width: 32vw; height: 5.47vw; background: #2ec448; position: relative; text-align: left; }
#message .txtArea .bt_more a img { height: 2.81vw; width: auto; margin-left: 1.56vw; }
#message .txtArea .bt_more a.arBt::before { margin-left: 9.38vw; width: 4.69vw; height: 1.5vw; background: url(../img/bt_arrow_w.svg) no-repeat bottom right/auto 100%; }
#message #syakun { -js-display: flex; display: -webkit-flex; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 10.16vw; }
#message #syakun li:first-child { -ms-flex-preferred-size: 14.06vw; flex-basis: 14.06vw; height: 7.81vw; background: #000; text-align: center; font-size: 3.44vw; color: #FFF; }
#message #syakun li:last-child { padding-left: 2.34vw; font-size: 4vw; font-weight: bold; line-height: 1.35; white-space: nowrap; }
#message .btList { -js-display: flex; display: -webkit-flex; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 0 2.34vw; }
#message .btList li { width: 47.5%; height: 10.16vw; }
#message .btList li a { display: block; height: 100%; position: relative; border: 4px solid #000; font-size: 3.75vw; font-weight: bold; color: #000; text-align: center; }
#message .btList li a.arBt::before { margin-left: 12.50vw; width: 7.03vw; height: 1.25vw; background: url(../img/bt_arrow_b.svg) no-repeat bottom right/auto 100%; }

/*=============================
works
=============================*/
#works { position: relative; margin-top: 11vw; }
#works .txtArea { }
#works .txtArea .titArea { padding-left: 3.91vw; padding-bottom: 12.5vw; margin-bottom: 4.69vw; padding-top: 7vw; }
#works iframe { position: absolute; top: 0px; right: 0; width: 45vw; height: 29vw; }
#works .full_btn { position: absolute; top: 31vw; right: 0; }
#works .full_btn a { width: 45vw; display: block; border: 1vw solid #2dc448; font-size: 3.2vw; text-align: center; padding: 2vw 0; font-weight: bold; color: #2dc448; }
#works .full_btn a:last-child { margin-top: 3vw; }
#works .txtArea .tit { margin-bottom: 4.69vw; }
#works .txtArea .copy { font-size: 5.47vw; letter-spacing: 0.05em; font-weight: bold; }
#works .txtArea .txt { font-size: 4.38vw; letter-spacing: 0.05em; line-height: 1.35; margin: 25vw 0 6.47vw; text-align: center; }
#works .txtArea .bt_more { text-align: center; }
#works .txtArea .bt_more a { display: inline-block; width: 32vw; height: 5.47vw; background: #2ec448; position: relative; text-align: left; }
#works .txtArea .bt_more a img { height: 2.81vw; width: auto; margin-left: 1.56vw; }
#works .txtArea .bt_more a.arBt::before { margin-left: 9.38vw; width: 4.69vw; height: 1.5vw; background: url(../img/bt_arrow_w.svg) no-repeat bottom right/auto 100%; }
#works .flex .bt_recruit a { width: 180px; margin: 0 auto 4vw; display: block; border: 1vw solid #2dc448; font-size: 3.2vw; text-align: center; padding: 2vw 0; font-weight: bold; color: #2dc448; }
