@charset "UTF-8";
/* 変数定義 */
/*--------------------------
font-size
---------------------------*/
/*行間計算*/
/*--------------------------
content-width
---------------------------*/
/* ----------------------------------------
All
---------------------------------------- */
html {
  font-size: 62.5%;
}

body * {
  font-family: "游ゴシック体", "YuGothic", "游ゴシック", "Yu Gothic", "Poppins", sans-serif;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
body *:hover {
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.container {
  max-width: 1120px;
  padding: 0 20px;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 975px) {
  .container {
    width: 94%;
  }
}

.container02 {
  max-width: 840px;
  padding: 0 20px;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 975px) {
  .container02 {
    width: 94%;
  }
}

.container03 {
  max-width: 690px;
  padding: 0 20px;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 975px) {
  .container03 {
    width: 94%;
  }
}

.is-page {
  padding-top: 77.19px;
}
@media screen and (max-width: 975px) {
  .is-page {
    padding-top: 64px;
  }
}

/* ----------------------------------------
    header top
---------------------------------------- */
.header.pc, .header--sp {
  background-color: rgba(255, 255, 255, 0);
}

.header.pc.is-scroll, .header--sp.is-scroll, .is-page .header.pc, .is-page .header--sp {
  background-color: white;
}

.header.pc .header__wrap {
  opacity: 0;
  pointer-events: none;
}

.header.pc.is-scroll .header__wrap, .is-page .header.pc .header__wrap {
  opacity: 1;
  pointer-events: auto;
}

.header.pc h1 a, .header--sp h1 a {
  position: relative;
}

.header.pc h1 a img, .header--sp h1 a img {
  opacity: 0;
}

.header.pc h1 a::after, .header--sp h1 a::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url(../img/dcc-logo-white.svg);
}

.header--sp .hamburger__obj span {
  background-color: #fff;
}

.header.pc.is-scroll h1 a img, .header--sp.is-scroll h1 a img, .is-page .header.pc h1 a img, .is-page .header--sp h1 a img {
  opacity: 1;
}
.header.pc.is-scroll h1 a::after, .header--sp.is-scroll h1 a::after, .is-page .header.pc h1 a::after, .is-page .header--sp h1 a::after {
  opacity: 0;
}
.header.pc.is-scroll .hamburger__obj span, .header--sp.is-scroll .hamburger__obj span, .is-page .header.pc .hamburger__obj span, .is-page .header--sp .hamburger__obj span {
  background-color: #00204B;
}

/* ----------------------------------------
    header menu
---------------------------------------- */
body .header--sp.open {
  background-color: rgba(255, 255, 255, 0);
}
body .header--sp.open h1 a img {
  opacity: 0;
}
body .header--sp.open h1 a::after {
  opacity: 1;
}
body .header--sp.open .hamburger__obj span {
  background-color: #00204B;
}
body .header--sp.open .hamburger__obj span {
  background-color: #fff;
}

/* ----------------------------------------
    mv
---------------------------------------- */
/* ----------------------------------------
menus
---------------------------------------- */
.Menus {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 24px auto 0;
}
.Menus .header__wrap {
  gap: 48px;
}
@media screen and (max-width: 975px) {
  .Menus {
    display: none;
  }
}

/* ----------------------------------------
    Gallery
---------------------------------------- */
.Gallery {
  margin-top: 80px;
}

.Gallery__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 80px;
}

.Gallery__con {
  width: calc(50% - 40px);
  -webkit-animation: fadeInUp 0.5s ease;
          animation: fadeInUp 0.5s ease;
}
@media screen and (max-width: 975px) {
  .Gallery__con {
    width: 100%;
  }
}
.Gallery__con.is-hidden {
  display: none;
}

.Gallery__title {
  font-size: 20px;
  font-size: 2rem;
  line-height: 1.5;
  color: #00204B;
}
.Gallery__title:hover {
  opacity: 0.7;
}
@media screen and (max-width: 975px) {
  .Gallery__title {
    font-size: 1.8rem;
  }
}

.Gallery__desc {
  margin-top: 8px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.Gallery__desc span, .Gallery__desc a {
  line-height: 21px;
  line-height: 2.1rem;
}

.Gallery__desc span {
  font-size: 14px;
  font-size: 1.4rem;
  color: #999;
  display: block;
}

.Gallery__desc a {
  color: #007BC2;
  font-weight: bold;
  margin-left: 8px;
  display: block;
  font-size: 14px;
  font-size: 1.4rem;
}
.Gallery__desc a:hover {
  opacity: 0.7;
}

.Gallery__img {
  overflow: hidden;
  position: relative;
  aspect-ratio: 480/270;
  width: 100%;
  height: auto;
  display: block;
  margin-top: 16px;
}

.Gallery__img img {
  display: block;
  width: 100%;
  height: auto;
  position: absolute;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
}

.Gallery__img:hover img {
  -webkit-transform: translate(-50%, -50%) scale(1.2);
          transform: translate(-50%, -50%) scale(1.2);
}

.Gallery__more {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  margin: 80px auto 0;
  cursor: pointer;
}

.Gallery__more img {
  padding: 10px 8px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  width: auto;
  height: 28px;
  height: 2.8rem;
  display: block;
}

.Gallery__more span {
  font-size: 18px;
  font-size: 1.8rem;
  color: #00204B;
  font-family: "Oswald", Oswald, sans-serif;
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  line-height: 28px;
  line-height: 2.8rem;
}

/* ----------------------------------------
Footer
---------------------------------------- */
footer {
  padding: 160px 0 40px;
}
@media screen and (max-width: 975px) {
  footer {
    padding: 120px 0 40px;
  }
}

footer p {
  text-align: center;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.5;
  color: #666666;
}

/* ----------------------------------------
section
---------------------------------------- */
/* ----------------------------------------
archive
---------------------------------------- */
/* ----------------------------------------
page
---------------------------------------- */
.ceo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 80px;
}
@media screen and (max-width: 975px) {
  .ceo {
    display: grid;
    grid-template-columns: 1fr;
    gap: 36px;
  }
}

.ceo__person {
  width: 240px;
}
@media screen and (max-width: 975px) {
  .ceo__person {
    width: 100%;
  }
}

.ceo__person img {
  display: block;
  width: 240px;
  height: auto;
}
@media screen and (max-width: 975px) {
  .ceo__person img {
    width: 100%;
  }
}

.ceo__name {
  margin-top: 14px;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: bold;
  line-height: 1.5;
  color: #00204B;
}

.ceo__career {
  margin-top: 14px;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.5;
  color: #00204B;
}

.ceo__message {
  width: calc(100% - 320px);
}
@media screen and (max-width: 975px) {
  .ceo__message {
    width: 100%;
  }
}
.ceo__message h2 {
  font-size: 32px;
  font-size: 3.2rem;
  font-weight: bold;
  font-family: "Oswald", Oswald, sans-serif;
  line-height: 2;
  color: #00204B;
  margin-bottom: 40px;
}
@media screen and (max-width: 975px) {
  .ceo__message h2 {
    font-size: 2.4rem;
  }
}
.ceo__message h3 {
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: 36px;
  font-weight: bold;
  line-height: 2;
  color: #00204B;
}
@media screen and (max-width: 975px) {
  .ceo__message h3 {
    font-size: 1.8rem;
    margin-bottom: 24px;
  }
}
.ceo__message p {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 24px;
  line-height: 2;
  color: #00204B;
}
@media screen and (max-width: 975px) {
  .ceo__message p {
    font-size: 1.4rem;
    margin-bottom: 18px;
  }
}
.ceo__message img {
  margin-bottom: 40px;
}
@media screen and (max-width: 975px) {
  .ceo__message img {
    margin-bottom: 24px;
  }
}
.ceo__message a {
  text-decoration: underline;
}

.ceo__news {
  margin-top: 80px;
}
.ceo__news h3 {
  font-size: 20px;
  font-size: 2rem;
  line-height: 1.5;
  color: #00204B;
  font-weight: bold;
}
.ceo__news ul {
  margin-top: 16px;
  font-size: 16px;
  font-size: 1.6rem;
  padding-left: 1em;
}
@media screen and (max-width: 975px) {
  .ceo__news ul {
    font-size: 1.4rem;
  }
}

.ceo__news ul li {
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 2;
  color: #00204B;
  text-indent: -0.5em;
  padding-left: 1em;
}
@media screen and (max-width: 975px) {
  .ceo__news ul li {
    font-size: 1.4rem;
  }
}
.ceo__news ul li::before {
  position: relative;
  top: -2px;
  left: -1em;
  display: inline-block;
  width: 8px;
  height: 8px;
  content: "";
  border-radius: 100%;
  background: #00204B;
}

/* ----------------------------------------
page
---------------------------------------- */
.single-body form input[type=text], .single-body form input[type=email], .single-body form input[type=tel], .single-body form input[type=url], .single-body form select, .single-body form textarea {
  padding: 16px;
  display: block;
  width: 100%;
  border: 1px solid #00204B;
  font-size: 16px;
  font-size: 1.6rem;
}
@media screen and (max-width: 975px) {
  .single-body form input[type=text], .single-body form input[type=email], .single-body form input[type=tel], .single-body form input[type=url], .single-body form select, .single-body form textarea {
    padding: 4px 8px;
  }
}
.single-body form label {
  font-weight: bold;
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 8px;
  line-height: 2;
}
.single-body form label span {
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: normal;
}
.single-body form .contact__select .wpcf7-form-control-wrap {
  position: relative;
}
.single-body form .contact__select .wpcf7-form-control-wrap::after {
  position: absolute;
  content: "";
  background-image: url(../img/more.svg);
  background-repeat: no-repeat;
  width: 16px;
  height: 9.43px;
  background-size: contain;
  right: 32px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  top: 50%;
}
@media screen and (max-width: 975px) {
  .single-body form .contact__select .wpcf7-form-control-wrap::after {
    right: 8px;
  }
}
.single-body form input[type=submit] {
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 2;
  color: #fff;
  font-weight: bold;
  text-align: center;
  margin: 16px auto 0;
  background-color: #00204B;
  padding: 16px 104px;
  display: block;
}
.single-body form input[type=submit]:hover {
  opacity: 0.7;
}

/* ----------------------------------------
page
---------------------------------------- */
.page__title {
  font-size: 32px;
  font-size: 3.2rem;
  line-height: 1.5;
  font-weight: bold;
  font-family: "Oswald", Oswald, sans-serif;
  color: #00204B;
}

.is-page .page__title {
  text-align: center;
  padding: 80px 0 100px;
}
@media screen and (max-width: 975px) {
  .is-page .page__title {
    padding: 40px 0 40px;
  }
}

.is-page .single-title .page__title {
  text-align: left;
  padding: 80px 0 40px;
}
@media screen and (max-width: 975px) {
  .is-page .single-title .page__title {
    padding: 40px 0 40px;
  }
}

@media screen and (max-width: 975px) {
  .company__img {
    margin-top: 40px;
  }
}

/* ----------------------------------------
single
---------------------------------------- */
.single-title {
  padding-bottom: 100px;
  border-bottom: 1px solid #00204B;
}

.single-title h3 {
  font-size: 20px;
  font-size: 2rem;
  line-height: 1.5;
}

.single-body h2 {
  font-size: 32px;
  font-size: 3.2rem;
  margin-top: 48px;
  font-weight: bold;
  font-family: "Oswald", Oswald, sans-serif;
  line-height: 2;
  color: #00204B;
  margin-bottom: 40px;
}
@media screen and (max-width: 975px) {
  .single-body h2 {
    font-size: 2.4rem;
    margin-top: 36px;
    letter-spacing: 0.02em;
  }
}
.single-body h3 {
  font-size: 24px;
  font-size: 2.4rem;
  margin-top: 36px;
  font-weight: bold;
  line-height: 2;
  color: #00204B;
}
@media screen and (max-width: 975px) {
  .single-body h3 {
    font-size: 1.8rem;
    margin-top: 24px;
  }
}
.single-body p {
  font-size: 16px;
  font-size: 1.6rem;
  margin-top: 24px;
  line-height: 2;
  color: #00204B;
}
@media screen and (max-width: 975px) {
  .single-body p {
    font-size: 1.4rem;
    margin-top: 18px;
  }
}
.single-body img {
  margin-top: 40px;
}
@media screen and (max-width: 975px) {
  .single-body img {
    margin-top: 24px;
  }
}
.single-body a {
  text-decoration: underline;
}
.single-body table tr td {
  border: none;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 2;
  color: #00204B;
}
@media screen and (max-width: 975px) {
  .single-body table tr td {
    font-size: 1.4rem;
  }
}
.single-body table tr td:nth-child(1) {
  white-space: nowrap;
}

/* ----------------------------------------
関連記事
---------------------------------------- */
.single-connect {
  margin-top: 160px;
}
@media screen and (max-width: 975px) {
  .single-connect {
    margin-top: 80px;
  }
}

.single-connect > h2 {
  font-size: 20px;
  font-size: 2rem;
  text-align: center;
  font-weight: bold;
  padding-bottom: 24px;
  border-bottom: 1px solid #00204B;
  margin-bottom: 80px;
}
@media screen and (max-width: 975px) {
  .single-connect > h2 {
    padding-bottom: 24px;
    margin-bottom: 40px;
  }
}

/* ----------------------------------------
last
---------------------------------------- */
.sp-flex, .sp-block {
  display: none !important;
}

@media screen and (max-width: 975px) {
  .sp-hide {
    display: none !important;
  }
  .sp-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .sp-block {
    display: block !important;
  }
}
.preload {
  -webkit-transition: 0 !important;
  transition: 0 !important;
}
/*# sourceMappingURL=style.css.map */
