@charset "UTF-8";
.gnav {
  position: relative;
  width: 100%;
  border-bottom: 5px solid #4aa84a;
  background: url(../img/bg_gnavi.png?2024) no-repeat bottom center;
}
@media screen and (max-width: 1000px) {
  .gnav {
    background-position: -700px 0;
  }
}
.gnav .gnav-inner {
  position: relative;
  z-index: 0;
  width: 1000px;
  margin: 0 auto;
}
.gnav ul {
  display: flex;
  align-items: end;
  height: 54px;
  border: 1px solid #cccccc;
  border-right: none;
  border-bottom: none;
  border-radius: 10px 0 0 0;
  background: linear-gradient(#fff, #f0f0f0);
}
.gnav ul li:not(.nav-contact) {
  text-align: center;
  width: 82.25px;
}
.gnav ul li:not(.nav-contact):nth-of-type(1), .gnav ul li:not(.nav-contact):nth-of-type(2), .gnav ul li:not(.nav-contact):nth-of-type(6) {
  width: 132px;
}
.gnav ul li:not(.nav-contact) a {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  height: 54px;
  color: #333 !important;
  text-decoration: none;
}
.gnav ul li:not(.nav-contact) a:hover {
  color: #e90011 !important;
}
.gnav ul li:not(.nav-contact) + li a::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 0;
  width: 1px;
  height: calc(100% - 16px);
  background-color: #ccc;
}
.gnav ul li:not(.nav-contact).is-active a {
  font-weight: 700;
  text-decoration: none;
}
.gnav ul li.nav-contact {
  position: relative;
  width: 275px;
  background: #4aa84a;
}
.gnav ul li.nav-contact::after {
  content: "";
  position: absolute;
  z-index: 0;
  left: 0;
  top: -32.5px;
  width: 100%;
  height: 33px;
  -webkit-clip-path: polygon(50% 0, 100% 100%, 0 100%);
          clip-path: polygon(50% 0, 100% 100%, 0 100%);
  background: #4aa84a;
}
.gnav ul li.nav-contact a {
  display: block;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.5;
  color: #fff;
  text-decoration: none;
  padding: 8px 0 10px 32px;
  box-sizing: border-box;
  background: url(../img/ico_arrow05.svg) no-repeat left 12px center/13px auto;
}
.gnav ul li.nav-contact a span {
  font-size: 15px;
}
.gnav ul li.nav-contact a::after {
  display: none;
}

a[data-lity],
a[data-micromodal-trigger=modal-video] {
  text-decoration: none;
}
a[data-lity]:hover,
a[data-micromodal-trigger=modal-video]:hover {
  opacity: 0.75;
  color: #333;
}

#modal-video {
  position: relative;
  z-index: 1234;
  display: none;
  text-decoration: none;
}
#modal-video.is-open {
  display: block;
}
#modal-video[aria-hidden=false] {
  animation: fadeIn 0.3s;
}
#modal-video[aria-hidden=true] {
  animation: fadeOut 0.3s;
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
#modal-video .modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.85);
  display: flex;
  justify-content: center;
  align-items: center;
}
#modal-video .modal-content {
  max-width: 960px;
  margin-inline: auto;
}
#modal-video .modal-content .video-wrap {
  aspect-ratio: 16/9;
}
#modal-video .modal-content .video-wrap .video {
  aspect-ratio: 16/9;
  width: 100%;
  height: 100%;
  display: block;
}
#modal-video .modal-content a.modal-close {
  display: block;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  color: #fff;
  padding: 8px 12px;
  width: 160px;
  margin: 16px auto 0;
  border-radius: 100px;
  border: 2px solid #fff;
}

/*
 * layout
 */
body {
  background: #fff url(../img/bg_main.png?2024) no-repeat top center;
}

.container .container-inner {
  position: relative;
  width: 100%;
  margin: 0 auto;
  background: linear-gradient(#fbe9d8, #fff 540px);
  background-position: top 149px center;
}

header {
  width: 1000px;
  height: 105px;
  margin: 0 auto;
  display: flex;
  align-items: center;
}
header .logo {
  width: 198px;
  margin-bottom: 0;
}
header .logo img {
  width: 100%;
  height: auto;
}
header h1 {
  font-size: 14px;
  font-weight: bold;
  margin: 0;
}

.breadcrumb {
  position: relative;
  z-index: 0;
  width: 100%;
  padding-top: 10px;
  height: 36px;
  box-sizing: border-box;
  background: #f5f5f5;
}
.breadcrumb ol {
  display: flex;
  align-items: center;
  max-width: 1000px;
  margin-inline: auto;
}
.breadcrumb ol li {
  font-size: 11px;
  line-height: 1.5;
  margin-right: 8px;
  padding-right: 18px;
  background: url(../img/ico_arrow06.svg) no-repeat center right/13px auto;
}
.breadcrumb ol li:last-of-type {
  background: none;
}
.breadcrumb ol li:last-of-type a {
  pointer-events: none;
  text-decoration: none;
}

.pagetitle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 708px;
  height: 149px;
  margin-bottom: 20px;
  background: #fff;
}
.pagetitle .title h2 {
  font-size: 30px;
  font-weight: bold;
  line-height: 1.4;
  margin: 0;
  color: #4aa84a;
}
.pagetitle .title .sub {
  font-size: 14px;
  font-weight: normal;
  margin: 0;
  color: #333;
}
.pagetitle .image {
  width: 344px;
  height: 149px;
}
.pagetitle .image img {
  width: 100%;
  aspect-ratio: 344/149;
}

.content {
  display: flex;
  justify-content: space-between;
  width: 1000px;
  margin-inline: auto;
  min-height: 1105px;
}

.content-inner {
  width: 690px;
  padding-bottom: 80px;
}

#btn-btob {
  position: absolute;
  z-index: 1002;
  top: -77px;
  left: 725px;
}

.btn-play-video {
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  color: #333;
  max-width: 160px;
  margin-inline: auto;
  padding: 8px 12px 10px;
  border: 1px solid #4aa84a;
  border-radius: 100px;
  box-shadow: 0 3px 0 #4aa84a;
  background: #fff url(../img/ico_arrow04.svg) no-repeat right 16px center/13px auto;
}

.btn-bukken-more {
  text-align: center;
  margin: auto;
}
.btn-bukken-more a {
  position: relative;
  display: inline-block;
  font-size: 14px;
  font-weight: bold;
  min-width: 180px;
  padding: 8px 48px 10px;
  text-decoration: none;
  border-radius: 100px;
  border: 1px solid #4aa84a;
  box-shadow: 0 3px 0 #4aa84a;
  background: url(../img/ico_arrow04.svg) no-repeat right 16px center/13px auto;
}
.btn-bukken-more a:hover {
  opacity: 0.75;
  color: #333;
}

.side {
  position: relative;
  width: 275px;
  margin-top: -36px;
}
.side .side-inner {
  width: 100%;
  margin: auto;
  border-radius: 0 0 10px 10px;
  background-color: #fff;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
}
.side .ttl-conttop,
.side .ttl-cont {
  font-size: 108%;
  font-weight: bold;
  line-height: 1.6;
  margin-bottom: 0;
  padding: 15px 15px;
  color: #4aa84a;
  border: solid #4aa84a 1px;
  border-right: none;
  border-left: none;
}
.side .ttl-conttop {
  border-top: none;
}
.side ul.list-1 a {
  display: block;
  color: #333;
}
.side ul.list-1 a::hover {
  color: #ff4d00;
}
.side ul.list-1 li {
  font-size: 14px;
  line-height: 1.6;
  margin: auto;
  padding: 16px 16px 16px 32px;
  background: url(../img/ico_arrow04.svg) no-repeat left 12px center/13px auto;
}
.side ul.list-1 li:nth-child(odd) {
  background-color: #f5f5f5;
}
.side ul.bukken-list li {
  padding-block: 14px;
}
.side ul.bukken-list li a {
  font-size: 14px;
  font-weight: bold;
}
.side .banner-1 {
  margin-top: 24px;
}
.side .banner-1 p {
  margin-bottom: 0;
  padding-bottom: 12px;
  text-align: center;
}

.pagetop {
  margin: 10px 0;
  text-align: right;
}
.pagetop a {
  font-size: 85%;
  line-height: 1.4;
  display: inline-block;
  padding-left: 22px;
  color: #333;
  background: url(../img/ico_pagetop.gif) no-repeat center left;
}

.area-info {
  clear: both;
  width: 100%;
  padding-bottom: 10px;
  background: #f6f6f6;
}
.area-info .area-info-row {
  display: flex;
  justify-content: space-between;
  width: 1000px;
  margin: auto;
  padding: 24px 0 0 0;
}
.area-info .area-info-col {
  font-size: 12px;
  line-height: 1.6;
  width: 484px;
}
.area-info .area-info-col h5 {
  margin-bottom: 4px;
}
.area-info .area-info-col p {
  margin-bottom: 16px;
}

.share {
  margin-top: 24px;
}
.share .share-btn {
  display: flex;
  justify-content: center;
}
.share .share-btn li {
  margin: auto 12px;
}
.share .share-btn li img {
  width: 36px;
  height: auto;
}

footer {
  width: 100%;
  background: #fff;
}

.footer-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 1000px;
  margin: auto;
  padding: 20px 0;
}
.footer-row .credit {
  font-size: 11px;
  color: #666;
  margin-bottom: 0;
}

.ttl-1 {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
  position: relative;
  display: flex;
  align-items: center;
  height: 56px;
  margin-bottom: 0;
  padding: 0 20px;
  color: #fff;
  border-radius: 8px 8px 0 0;
  background: rgb(106, 184, 106);
  background: linear-gradient(to bottom, rgb(106, 184, 106) 0%, rgb(75, 168, 75) 100%);
}
.ttl-1 .link {
  position: absolute;
  top: 20px;
  right: 20px;
}
.ttl-1 .link a {
  display: block;
  font-size: 14px;
  line-height: 1.4;
  color: #fff;
  padding-left: 20px;
  background: url(../img/ico_arrow05.svg) no-repeat center left/13px auto;
}

.ttl-1s {
  position: relative;
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.6;
  position: relative;
  height: 48px;
  margin-bottom: 0;
  padding: 0 24px;
  color: #333;
  border-radius: 8px 8px 0 0;
  background-color: #f5f5f5;
}
.ttl-1s::after {
  content: "";
  position: absolute;
  top: 12px;
  left: 10px;
  width: 3px;
  height: calc(100% - 24px);
  background-color: #4aa84a;
}

.ttl-2s {
  font-size: 108%;
  font-weight: bold;
  line-height: 2.8;
  height: 38px;
  margin-bottom: 0;
  padding: 0 15px;
  color: #fff;
}

.ttl-2s {
  background: url(../img/bg_title02s.png) no-repeat top left;
}

.ttl-3s {
  background: url(../img/bg_title03s.png) no-repeat top left;
}

.ttl-2 {
  font-size: 100%;
  font-weight: bold;
  line-height: 1.8;
  padding: 6px 9px;
  color: #5f5436;
  background-color: #f4f3f1;
}

.ttl-side-1 {
  font-size: 108%;
  font-weight: bold;
  line-height: 3;
  height: 41px;
  margin-bottom: 15px;
  padding: 0 9px;
  color: #fff;
  background: url(../img/bg_title_side01.jpg) no-repeat;
}

.ico-arr-3 {
  padding-left: 16px;
  background: url(../img/ico_arrow03.gif) no-repeat 0 5px;
}

.box-1 {
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 690px;
  margin-bottom: 16px;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  background-color: #fff;
}
.box-1 + .box-1 {
  margin-top: 16px;
}

.box-1s {
  position: relative;
  width: 331px;
  margin-bottom: 24px;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  background-color: #fff;
}

.box-1-inner {
  width: 640px;
  margin: auto;
  padding: 24px 24px 32px;
}

.box-1-inner2 {
  width: 688px;
  margin: auto;
  padding-bottom: 4px;
}

.box-1s-inner {
  width: 300px;
  margin: auto;
  padding: 15px;
}
.box-1s-inner.row {
  display: flex;
  align-items: center;
}

/*
 * top
 */
#index .main {
  min-height: 470px;
  background: url(../img/index_main_bg.jpg?1711) no-repeat top center;
}
@media screen and (max-width: 1000px) {
  #index .main {
    background-position: -460px 0;
  }
}
#index .main .main-inner {
  width: 1000px;
  margin: auto;
}
#index .main h1 {
  text-align: center;
}
#index .main .site-catch {
  font-size: 12px;
  padding: 6px 0 0;
  text-align: right;
  color: #fff;
}
#index .side {
  margin-top: 0;
}
#index .container-inner {
  background-position: center top;
}
#index .content {
  min-height: 925px;
}
#index .new-release {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
#index .new-release .box-1s .thumb {
  min-height: 60px;
  margin: 0;
  padding-top: 8px;
}
#index .new-release .box-1s .thumb img {
  width: 120px;
}
#index .new-release .box-1s .txt {
  font-size: 14px;
  font-weight: bold;
  line-height: 1.6;
  margin-left: 8px;
}

#news-ticker {
  display: flex;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 48px;
  margin-block: 24px;
  border-radius: 8px;
  background-color: #fff;
}

#ttl-news {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  width: 125px;
  height: 100%;
  background: rgb(106, 184, 106);
  background: linear-gradient(to bottom, rgb(106, 184, 106) 0%, rgb(75, 168, 75) 100%);
}

table.list-1 {
  width: 100%;
  margin-bottom: 15px;
}
table.list-1 th,
table.list-1 td {
  font-size: 14px;
  line-height: 1.6;
  padding: 8px 10px;
  border: solid #ddd 1px;
}
table.list-1 th p:last-of-type,
table.list-1 td p:last-of-type {
  margin-bottom: 0;
}
table.list-1 th {
  font-weight: bold;
  color: #4aa84a;
  background-color: #f5f5f5;
}
table.list-1 th.st {
  width: 26%;
}
table.list-1 th.area {
  width: 50%;
}
table.list-1 th.st2 {
  width: 27%;
}
table.list-1 th.area2 {
  width: 40%;
}

/*
 * article list
 */
.article-list {
  position: relative;
  min-height: 30px;
  margin: auto;
  padding: 0 4px 16px;
}

.article-list-odd {
  background-color: #eafcea;
}

.article-list dl {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row-reverse;
  position: relative;
  min-height: 42px;
  padding: 0 16px;
}

.article-list dl dt {
  font-size: 14px;
  line-height: 1.4;
}

.article-list dl dd {
  font-size: 14px;
  line-height: 1.4;
}
.article-list dl dd .is-active {
  pointer-events: none;
  text-decoration: none;
  font-weight: bold;
}
.article-list dl dd .is-active::after {
  content: "（閲覧中）";
  font-weight: normal;
  color: #e90011;
}
.article-list dl dd.is-video::before {
  content: "動画配信中";
  font-size: 12px;
  font-weight: 700;
  color: #4aa84a;
  text-decoration: none !important;
  border-radius: 4px;
  margin-right: 8px;
  padding: 1px 4px 2px;
  border: 1px solid #4aa84a;
  background: #fff;
}

/*
 * article detail
 */
.article {
  position: relative;
  display: flex;
  width: 100%;
  margin: 0 auto 48px auto;
  padding: 0;
}
.article .article-videothumb {
  width: 320px;
}
.article .article-videothumb img {
  width: 100%;
  height: auto;
}
.article .article-detail {
  flex: 1;
  margin-left: 24px;
}
.article .article-detail dl {
  margin-bottom: 15px;
}
.article .article-detail dl dt {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.6;
  margin-bottom: 3px;
}
.article .article-detail dl dd.date {
  color: #999;
}
.article .article-detail dl dd.client {
  font-size: 93%;
  line-height: 1.6;
  color: #999;
}

.screen {
  margin-top: 15px;
  text-align: center;
}

.screen img {
  border: solid #ccc 1px;
}

.article-area {
  display: flex;
}
.article-area .article-areamap {
  width: 150px;
}
.article-area .article-areainfo {
  flex: 1;
  margin-left: 24px;
}

/*
 * corp
 */
#corp #baitai {
  margin-bottom: 25px;
}

#corp #baitai #baitai-cap {
  display: inline;
  float: right;
  width: 240px;
}

#corp #baitai #baitai-detail {
  display: inline;
  float: left;
  width: 370px;
  margin-right: 28px;
}

#corp #baitai #baitai-detail input[type=text],
#corp #baitai #baitai-detail textarea {
  box-sizing: border-box;
  width: 100%;
  padding: 4px;
}

#corp #baitai #baitai-detail .btn_wrap {
  position: relative;
}

#corp #baitai #baitai-detail .btn_wrap .btn_submit {
  font-size: 13px;
  font-weight: bold;
  display: block;
  box-sizing: border-box;
  width: 150px;
  padding: 8px;
  cursor: pointer;
  text-align: center;
  color: #fff;
  border-radius: 4px;
  background: #ff7614;
}

#corp #baitai #baitai-detail .btn_wrap .is_disabled {
  position: absolute;
  top: 0;
  left: 0;
  width: 150px;
  height: 100%;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.75);
}

.lity {
  background: rgba(0, 0, 0, 0.75) !important;
}

/*
 * clear
 */
.box-1,
#corp,
#corp #baitai,
#footer #footer-bnr,
#footer {
  display: inline-block;
}

.box-1:after,
#corp:after,
#corp #baitai:after,
#footer #footer-bnr:after,
#footer:after {
  display: block;
  clear: both;
  content: "";
}