@charset "utf-8";
/* CSS Document */
/* style
------------------------------------------------------------*/
html {
  overflow-y: scroll;
}
body {
  width: 100%;
  font-size: 100%;
  font-size: 16px;
  color: #262626;
  background: #FFFFFF;
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", sans-serif;
  font-feature-settings: "palt";
  line-height: 1.5;
  font-weight: 400;
}
/* responsive
------------------------------------------------------------*/
@media screen and (max-width: 767px) {
  .pc_show {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  .mb_show {
    display: none;
  }
}
@media screen and (min-width: 479px) {
  .sp_show {
    display: none;
  }
}
.inline_block {
  display: inline-block;
}
/* layout
------------------------------------------------------------*/
#wrapper {
  min-width: 320px;
}
.contents--wrap {
  padding: 5rem 0;
}
.contents--inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 5.2%;
}
.flex--box {
  display: flex;
  justify-content: space-between;
}
.flex-item03 {
  width: 30.4%;
}
@media screen and (max-width: 767px) {
  .contents--wrap {
    padding: calc(86 / 750 * 100vw) 0;
  }
  .contents--inner {
    padding: 0 5.6%;
  }
  .flex-item03 {
    width: 100%;
  }
  .flex--box.mb_column {
    flex-direction: column;
  }
  .flex--box.mb_column_rev {
    flex-direction: column-reverse;
  }
}
/* color
------------------------------------------------------------*/
.bg_blue {
  background: #d0f1f6;
}
.bl {
  color: #12b7d2;
}
.lb {
  color: #5acde0;
}
.link_no_decoration {
 color: #262626;	
}
/* fonts
------------------------------------------------------------*/
/* h1 */
.page_headline {
  font-family: "Roboto", sans-serif;
  font-size: 3.4375em;
  font-weight: 900;
  font-style: italic;
  color: #FFFFFF;
}
.page_headline_jp {
  display: block;
  font-size: .29em;
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", sans-serif;
  font-style: normal;
  letter-spacing: .02em;
  margin-top: -1.2em;
}
/* h2 */
.contents_headline {
  font-family: "Roboto", sans-serif;
  font-size: 3.875rem;
  font-weight: 900;
  font-style: italic;
}
.contents_headline_jp {
  display: block;
  color: #12b7d2;
  font-size: .258em;
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", sans-serif;
  font-style: normal;
  letter-spacing: .02em;
  margin-top: -1.2em;
}
/* h3 */
.contents_title {
  font-size: 1.375em;
}
/* text */
.contents_text {
  font-size: 1rem;
  line-height: 1.625;
  letter-spacing: .02em;
  text-align: justify;
}
.txt_center {
  text-align: center;
}
.eng {
  font-family: "Roboto", sans-serif;
}
.header_menu_list.eng {
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .page_headline {
    font-size: calc(55 / 750 * 100vw);
  }
  .page_headline_jp {
    font-size: calc(26 / 750 * 100vw);
	  margin-top: -.75em;  
  }	
  .contents_headline {
    font-size: calc(92 / 750 * 100vw);
  }
  .contents_headline_jp {
    font-size: calc(28 / 750 * 100vw);
  }
  .contents_title {
    font-size: calc(34 / 750 * 100vw);
  }
  .contents_text {
    font-size: calc(28 / 750 * 100vw);
  }
}
/* button 
------------------------------------------------------------*/
.more_button_link {
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background: none;
  border-radius: 4px;
  color: #12b7d2;
  max-width: 232px;
  margin: 0 auto;
  padding: 1em 1.5em;
  transition: 0.3s ease-in-out;
  font-weight: 500;
  border: 1px solid #12b7d2;
}
.more_button_link::after {
  content: "";
  position: absolute;
  top: 50%;
  bottom: 0;
  right: 1.5625rem;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: right 0.3s;
  width: 8px;
  height: 8px;
  border-top: solid 1px currentColor;
  border-right: solid 1px currentColor;
  transform: translateY(-50%) rotate(45deg);
}
.more_button_link:hover {
  background: #12b7d2;
  color: #d0f1f6;
}
.more_button_link:hover::after {
  right: 2em;
}
.mail_button_link {
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background: none;
  border-radius: 4px;
  color: #12b7d2;
  max-width: 232px;
  margin: 0 auto;
  padding: 1em 4.8125em 1em 6.9375em;
  transition: 0.3s ease-in-out;
  font-weight: 500;
  border: 1px solid #12b7d2;
}
.mail_button_link:hover {
  background: #12b7d2;
  color: #d0f1f6;
}
.mail_button_link::before {
  position: absolute;
  content: url('../image/mail_bl.svg');
  width: 1.5em;
  height: 1em;
  top: 50%;
  bottom: 0;
  left: 4.8125em;
  right: 0;
  margin-top: -0.65em;
}
.mail_button_link:hover::before {
  content: url('../image/mail_lb.svg');
}
@media screen and (max-width: 767px) {
  .more_button_link {
    font-size: calc(26 / 750 * 100vw);
    max-width: calc(348 / 750 * 100vw);
    padding: calc(24 / 750 * 100vw);
  }
  .more_button_link::after {
    right: calc(36 / 750 * 100vw);
    width: calc(10 / 750 * 100vw);
    height: calc(10 / 750 * 100vw);
  }
  .more_button_link:hover::after {
    right: calc(48 / 750 * 100vw);
  }
  .mail_button_link {
    font-size: calc(26 / 750 * 100vw);
    max-width: calc(348 / 750 * 100vw);
    padding: calc(24 / 750 * 100vw) calc(112 / 750 * 100vw) calc(24 / 750 * 100vw) calc(166 / 750 * 100vw);
  }
  .mail_button_link::before {
    width: calc(36 / 750 * 100vw);
    height: calc(24 / 750 * 100vw);
    left: calc(114 / 750 * 100vw);
  }
}
/* header
------------------------------------------------------------*/
.header {
  width: 100%;
  background: #FFFFFF;
  border-bottom: 1px solid #12b7d2;
  z-index: 10;
  position: fixed;
  top: 0;
  left: 0;
}
.header--inner {
  max-width: 1440px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  padding-left: 1.25em;
}
.check {
  display: none;
}
.header_menu--group {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.header_logo {
  padding: 1.25em 0 1.25em;
}
.header_top_link {
  transition: transform 0.3s;
}
.header_top_link:hover .header_logo_img {
  opacity: .5;
  transition: transform 0.3s ease-in-out;
}
.header_menu_list {
  font-weight: 500;
  letter-spacing: .07em;
}
.header_menu_list {
  margin-right: 3.75em;
}
@media screen and (max-width: 999px) {
  .header_menu_list {
    margin-right: calc(36 / 960 * 100vw);
  }
}
.header_menu_list:not(:last-of-type) .header_menu_link {
  position: relative;
}
.header_menu_list:not(:last-of-type) .header_menu_link::after {
  position: absolute;
  left: 50%;
  margin-left: -.625em;
  content: '';
  width: 1.25em;
  height: 3px;
  background: #12b7d2;
  bottom: -6px;
  transform: scale(0, 1);
  transform-origin: center top;
  transition: transform 0.3s ease-in-out;
}
.header_menu_list:not(:last-of-type) .header_menu_link:hover::after {
  transform: scale(1, 1);
}
.header_menu_list:last-of-type {
  margin-right: 0;
}
.header_menu_list:last-of-type .header_menu_link {
  position: relative;
  color: #FFFFFF;
  background: #6b6b6b;
  padding: 1.75em 2.5em 1.75em 4.875em;
  z-index: 1;
}
.header_menu_list:last-of-type .header_menu_link:hover {
  opacity: .5;
  transition: transform 0.3s ease-in-out;
}
.header_menu_list:last-of-type .header_menu_link::before {
  position: absolute;
  content: url('../image/mail.svg');
  width: 1.5em;
  height: 1em;
  top: 50%;
  bottom: 0;
  left: 2.5em;
  right: 0;
  margin-right: .625em;
  margin-top: -.5em;
}
.header_menu_link {
  color: #262626;
  display: block;
  transition: 1s all;
}
.header_menu_link.current {
  position: relative;
}
.header_menu_list:not(:last-of-type) .header_menu_link.current::after {
  position: absolute;
  left: 50%;
  margin-left: -.625em;
  content: '';
  width: 1.25em;
  height: 3px;
  background: #12b7d2;
  bottom: -6px;
  transform: scale(1, 1);
}
.header_menu_list:last-of-type .header_menu_link.current {
  border-bottom: none;
}
@media screen and (max-width: 767px) {
  .header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
  }
  .header--inner {
    padding: 0;
  }
  .header_logo {
    padding: calc(20 / 750 * 100vw) 0 calc(16 / 750 * 100vw) calc(20 / 750 * 100vw);
  }
  .header_logo_img {
    width: calc(290 / 750 * 100vw);
  }
  .header_menubutton {
    position: fixed;
    top: 0;
    right: 0;
    width: calc(90 / 750 * 100vw);
    height: calc(90 / 750 * 100vw);
    background: #12b7d2;
    display: block;
    cursor: pointer;
    z-index: 100;
  }
  .header::after {
    content: "";
    display: block;
    top: 0px;
    right: 0px;
  }
  .bar {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: calc(6 / 750 * 100vw);
    background-color: #ffffff;
    -webkit-transition: all .5s;
    transition: all .5s;
    transform-origin: center center;
  }
  .bar.top {
    width: calc(40 / 750 * 100vw);
    top: calc(27 / 750 * 100vw);
    left: calc(25 / 750 * 100vw);
    opacity: 1;
  }
  .bar.middle {
    width: calc(40 / 750 * 100vw);
    top: calc(42 / 750 * 100vw);
    left: calc(25 / 750 * 100vw);
    opacity: 1;
  }
  .bar.bottom {
    width: calc(40 / 750 * 100vw);
    top: calc(57 / 750 * 100vw);
    left: calc(25 / 750 * 100vw);
    transform-origin: center center;
  }
  .check:checked ~ .header_menubutton {
    background: #a2a2a2;
  }
  .check:checked ~ .header_menu--wrap {
    display: block;
  }
  .check:checked ~ .contents {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
    animation-duration: 1s;
  }
  .check:checked ~ .header_menubutton .top {
    transform: translateY(calc(15 / 750 * 100vw)) rotate(45deg);
  }
  .check:checked ~ .header_menubutton .middle {
    opacity: 0;
  }
  .check:checked ~ .header_menubutton .bottom {
    transform: translateY(calc(-15 / 750 * 100vw)) rotate(-45deg);
  }
  .header_menu--wrap {
    display: none;
    box-sizing: border-box;
    position: fixed;
    top: calc(91 / 750 * 100vw);
    left: 0;
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    margin-top: 0;
    padding: calc(40 / 750 * 100vw) calc(42 / 750 * 100vw) calc(105 / 750 * 100vw);
    animation-duration: 0.5s;
    animation-name: toptobottom;
    z-index: 50;
  }
  .header_menu--inner {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 85vh;
  }
  .header_menu--group {
    flex-direction: column;
    justify-content: flex-start;
    margin-right: 0;
    margin-left: 0;
    padding: 0;
  }
  .header_menu_list {
    position: relative;
    width: 100%;
    padding: 0;
    font-size: 1rem;
    margin-right: 0;
  }
  .header_menu_list:not(:nth-last-of-type(-n+2)) {
    border-bottom: 2px solid #88dbe8;
  }
  .header_menu_list:not(:last-of-type) .header_menu_link::after {
    display: none;
  }
  .header_menu_list.eng {
    font-family: "Roboto", sans-serif;
    font-size: calc(55 / 750 * 100vw);
    font-weight: 900;
    font-style: italic;
  }
  .mb_menu_title {
    position: absolute;
    left: calc(344 / 750 * 100vw);
    color: #12b7d2;
    font-weight: 300;
    font-style: normal;
    font-size: calc(26 / 750 * 100vw);
    top: 50%;
    margin-top: calc(-20 / 750 * 100vw);
    font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", sans-serif;
  }
  .header_menu_link {
    position: relative;
    padding: calc(40 / 750 * 100vw) 0;
    padding-left: calc(38 / 750 * 100vw);
  }
  .header_menu_link::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: calc(7 / 750 * 100vw);
    height: calc(52 / 750 * 100vw);
    background-color: #12b7d2;
  }
  .header_menu_link.current::after {
    display: none;
  }
  .mb_menu_contact {
    font-size: calc(26 / 750 * 100vw);
    text-align: center;
  }
  .mb_menu_contact .mb_menu_contact_link {
    position: relative;
    color: #FFFFFF;
    background: #6b6b6b;
    border-radius: 6px;
    padding: calc(30 / 750 * 100vw) calc(84 / 750 * 100vw) calc(30 / 750 * 100vw) calc(140 / 750 * 100vw);
    z-index: 1;
  }
  .mb_menu_contact .mb_menu_contact_link::before {
    position: absolute;
    content: url('../image/mail.svg');
    width: calc(36 / 750 * 100vw);
    height: calc(24 / 750 * 100vw);
    top: 50%;
    bottom: 0;
    left: calc(84 / 750 * 100vw);
    margin-top: calc(-16 / 750 * 100vw);
    right: 0;
  }
  .mb_menu--inner {
    width: calc(470 / 750 * 100vw);
    margin: calc(65 / 750 * 100vw) auto 0;
  }
  .mb_menu .p_mark {
    width: calc(80 / 750 * 100vw);
  }
  .mb_menu .p_mark_text, .mb_menu .privacy_text {
    font-size: calc(24 / 750 * 100vw);
  }
}
@keyframes toptobottom {
  0% {
    transform: translateY(-100%);
    opacity: 0;
  }
  50% {
    opacity: 0;
  }
  80% {
    opacity: .3;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
/* pagetop
------------------------------------------------------------*/
#page_top {
  position: fixed;
  bottom: 3.5rem;
  right: 50%;
  margin-right: -34.75rem;
  width: 44px;
  height: 44px;
  z-index: 100;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
}
#page_top.is-show {
  opacity: 1;
  visibility: visible;
}
#page_stop:hover {
  opacity: .6;
  transform: translateY(-5px);
}
@media screen and (max-width: 1199px) {
  #page_top {
    right: 1.5em;
    margin-right: 0;
  }
}
@media screen and (max-width: 767px) {
  #page_top {
    bottom: 3.5rem;
  }
}
/* footer
------------------------------------------------------------*/
.footer {
  width: 100%;
}
.footer_privacy {
  font-size: 0.875em;
  padding-bottom: 1.625rem;
}
.footer--inner {
  max-width: 390px;
  margin: 0 auto;
}
.footer_privacy .flex--box {
  align-items: center;
}
.privacy_link {
  color: #262626;
  text-decoration: underline;
  transition: 1s all;
}
.privacy_link:hover {
  opacity: .7;
}
.footer_copyright {
  text-align: center;
  background: #12b7d2;
  padding: 1em 0;
}
.copyright {
  font-size: 0.75rem;
  color: #FFFFFF;
  letter-spacing: .02rem;
}
@media screen and (max-width: 767px) {
  .copyright {
    font-size: calc(18 / 750 * 100vw);
  }
}
/* contact
------------------------------------------------------------*/
.contact--wrap .contents_headline {
  margin-bottom: 2rem;
}
.contact--wrap .flex--box {
  justify-content: flex-start;
}
.contact--wrap .text--box {
  width: 40.4%;
  margin-right: 9.2%;
}
.contact--wrap .phone_link {
  color: #12b7d2;
  font-weight: bold;
  font-size: 1.5625em;
}
.contact--wrap .mail_button {
  margin-top: 3em;
}
.contact--wrap .mail_button_link {
  margin-left: 0;
}
.contact--wrap .image--box {
  width: 32%;
}
@media screen and (max-width: 767px) {
  .contact--wrap .contents_headline {
    margin-bottom: calc(50 / 750 * 100vw);
  }
  .contact_img {
    width: calc(320 / 750 * 100vw);
    margin: 0 auto;
  }
  .contact--wrap .phone_link {
    font-size: calc(38 / 750 * 100vw);
    margin-top: calc(36 / 750 * 100vw);
  }
  .contact--wrap .text--box {
    width: 100%;
    margin-right: 0;
  }
  .contact--wrap .image--box {
    width: 100%;
  }
  .contact--wrap .mail_button {
    margin-top: calc(70 / 750 * 100vw);
  }
  .contact--wrap .mail_button_link {
    margin: 0 auto;
  }
}