@charset "utf-8";
/* CSS Document */

/* 全体装飾ここから
---------------------------------------*/
html {
  -webkit-box-sizing: border-box;/*borderまでを含めたサイズをwidthとして指定する*/
  box-sizing: border-box;
  font-size: 62.5%;/*標準16pxの62.5%=10px*/
  scroll-behavior: smooth;/*スムーズスクロール。旧iosでは非対応。どうしても必要な場合はjs*/
}
 
body {
    font-family: 'Braah One', sans-serif;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    -webkit-font-smoothing: antialiased;/*文字のアンチエイリアス設定*/
    -moz-osx-font-smoothing: grayscale; /*Firefox用の文字のアンチエイリアス設定*/
    font-feature-settings: "palt"; /*文字詰め*/
    letter-spacing: 0; /*文字間の設定*/
    line-height: 1.75; /*行間の設定*/
    width: 100%;
    background-size: contain;
    color: #1D2B61;
}

.sitewrapper {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

img {
  max-width: 100%;
  height: auto;/*高さは幅に応じて*/
  vertical-align: bottom;/*画面下に謎に開く余白防止*/
}

li {
  list-style: none;
}

/* 全体装飾ここまで
---------------------------------------*/



/*headerデザインここから
---------------------------------------*/

/*navここから*/
.nav {
  background-color: #fff;
}

.nav_list {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15rem;
}

.nav_list li {
  padding-top: 2rem;
}

a {
  color: #00081A;
  text-decoration: none;
  font-size: 3rem;
}

.menu-subtitle {
  display: block;
  font-size: 1.8rem;
  color: #9f9f9f;
  text-align: center;
  line-height: 0;
  padding: 0.5rem;
}

.nav_item {
  transition: 1.5s;
}

.nav_item:hover {
  opacity: 0.4;
  transition: 1.5s;
}

/*ハンバーガーメニュー*/

.openbtn {
  display: none;
}

/*headerデザインここまで
---------------------------------------*/



/*mainデザインここから
---------------------------------------*/

.top_main_img img {
  width: 100%;
}

.kasou_home {
  width: 100%;
}

.kasou_home_660 {
  display: none;
}

.top_main_img {
  position: relative;
}

.top_img_down {
  display: none;
}

.read_txt_1200 {
  display: none;
}

.read_txt_660 {
  display: none;
}

.top_img_660 {
  display: none;
}

.top_img_660_kasou {
  display: none;
}

/*スクロールバー*/

.scroll {
  display: inline-block;
  position: absolute;
  left: 5%;
  bottom: 0;
  z-index: 2;
  padding: 10px 10px 110px;
  overflow: hidden;
  color: #fff;
  font-size: 14px;
  font-family: "Josefin Sans", sans-serif;
  line-height: 1;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-decoration: none;
  writing-mode: vertical-lr;
  font-weight: bold;
}

.scroll::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 1px;
  height: 100px;
  background: #fff;
  animation: sdl 2s cubic-bezier(1, 0, 0, 1) infinite;
}

@keyframes sdl {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  35% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  35.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  70%,
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}

/*右下固定バナー*/
.fixed_bottom {
  background-color: #FFF100;
  display: flex;
  padding: 1em;
  position: fixed;
  bottom: 0;
  right: 0;
  z-index: 100;
  align-items: center;
}


.fixed_bottom img {
  margin-right: 1.6vw;
}

/*System_txtエリア*/
.system_flex {
  display: flex;
  margin: 5vw 0;
}

.system_txt_area {
  margin: 5vw 5vw 0 15vw;
}

.system_title {
  font-family: 'Braah One', sans-serif;
  font-size: 6rem;
  color: #00081A;
}

.system_txt {
  font-size: 1.9rem;
  margin-bottom: 2vw;
  font-weight: 800;
}

.home_img02  {
  width: 100%;
}

.home_img02_660  {
  display: none;
}

.home_img03  {
  width: 100%;
}

.home_img03_1200 {
  display: none;
}

.home_img03_660 {
  display: none;
}

/*View more ボタンデザインCSSここから*/
.btn,
a.btn,
button.btn {
  font-size: 1.8rem;
  font-weight: 800;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 10rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #FFFFFF;
  border-radius: 0.5rem;
}

a.btn--pink {
  color: #FFFFFF;
  background-color: #E84885;
  border-bottom: 5px solid #B83265;
}

a.btn--pink:hover {
  opacity: 0.6;
}

/*Access_エリア*/

.access_title {
  font-family: 'Braah One', sans-serif;
  font-size: 6rem;
  color: #00081A;
  text-align: center;
  margin: 4vw 0;
}

/*access_ボタン*/
.access_btn,
a.access_btn,
button.access_btn {
  font-size: 1.8rem;
  font-weight: 800;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 10rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #FFFFFF;
  border-radius: 0.5rem;
  left: 42%;
  margin: 4vw 0;
}

/*contact_ボタン*/
.contact_btn,
a.contact_btn,
button.contact_btn {
  font-size: 1.8rem;
  font-weight: 900;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 2.5rem 10rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #FFFFFF;
  border-radius: 0.5rem;
  left: 65%;
  top: 50%;
}

a.btn--white {
  color: #E84885;
  background-color: #FFFFFF;
  border-bottom: 5px solid #C2C2C2;
  bottom: 265px;
}

a.btn--white:hover {
  opacity: 0.8;
}

/*System_下層ページのCSS*/

.system_txt_area_kasou {
  margin: 5vw 2vw 0 10vw;
}

.system_title_kasou {
  font-family: 'Braah One', sans-serif;
  font-size: 4.2rem;
  color: #00081A;
}

/*Contact_下層ページのCSS*/

.contact_title_kasou {
  font-family: 'Braah One', sans-serif;
  font-size: 3rem;
  color: #00081A;
  text-align: center;
  margin: 4vw 0 2vw 0;
}

.contact_txt {
  font-size: 1.9rem;
  margin-bottom: 2vw;
  color: #00081A;
  text-align: center;
  font-weight: 800;
}

.contact_txt_red {
  font-size: 2rem;
  margin-bottom: 2vw;
  color: #D20000;
  text-align: center;
}

/*Contact_form*/
.Form {
  margin-top: 80px;
  margin-left: auto;
  margin-right: auto;
  max-width: 720px;
}
@media screen and (max-width: 480px) {
  .Form {
    margin-top: 40px;
  }
}
.Form-Item {
  border-top: 1px solid #ddd;
  padding-top: 24px;
  padding-bottom: 24px;
  width: 100%;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 480px) {
  .Form-Item {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 16px;
    padding-bottom: 16px;
    flex-wrap: wrap;
  }
}
.Form-Item:nth-child(5) {
  border-bottom: 1px solid #ddd;
}
.Form-Item-Label {
  width: 100%;
  max-width: 248px;
  letter-spacing: 0.05em;
  font-weight: bold;
  font-size: 18px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Label {
    max-width: inherit;
    display: flex;
    align-items: center;
    font-size: 15px;
  }
}
.Form-Item-Label.isMsg {
  margin-top: 8px;
  margin-bottom: auto;
}
@media screen and (max-width: 480px) {
  .Form-Item-Label.isMsg {
    margin-top: 0;
  }
}
.Form-Item-Label-Required {
  border-radius: 6px;
  margin-right: 8px;
  padding-top: 8px;
  padding-bottom: 8px;
  width: 65px;
  display: inline-block;
  text-align: center;
  background: #E84885;
  color: #fff;
  font-size: 14px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Label-Required {
    border-radius: 4px;
    padding-top: 4px;
    padding-bottom: 4px;
    width: 32px;
    font-size: 10px;
  }
}
.Form-Item-Input {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-left: 40px;
  padding-left: 1em;
  padding-right: 1em;
  height: 48px;
  flex: 1;
  width: 100%;
  max-width: 410px;
  background: #eaedf2;
  font-size: 18px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Input {
    margin-left: 0;
    margin-top: 18px;
    height: 40px;
    flex: inherit;
    font-size: 15px;
  }
}
.Form-Item-Textarea {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-left: 40px;
  padding-left: 1em;
  padding-right: 1em;
  height: 216px;
  flex: 1;
  width: 100%;
  max-width: 410px;
  background: #eaedf2;
  font-size: 18px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Textarea {
    margin-top: 18px;
    margin-left: 0;
    height: 200px;
    flex: inherit;
    font-size: 15px;
  }
}


/*mainデザインここまで
---------------------------------------*/



/*footerデザインここから
---------------------------------------*/

.footer_logo_660 {
  display: none;
}

small {
  display: block;
  font-size: 2em;
  color: #00081A;
  text-align: center;
  margin: 3vw 0;
  margin-bottom: 10vw
}

/*footerデザインここまで
---------------------------------------*/



/*レスポンシブデザインここから(max-width:1700px)
======================================================
======================================================*/

@media(max-width:1700px){
  .system_txt_area {
    margin: 5vw 5vw 0 8vw;
}

  a.btn--white {
    bottom: 248px;
  }

  /*下層_System*/
  .system_txt_area_kasou {
    margin: 5vw 2vw 0 4vw;
  }

  /*下層_Access*/
  .access_area {
    margin-top: 12vw;
  }
}

/*レスポンシブデザインここから(max-width:1600px)
======================================================
======================================================*/

@media(max-width:1600px){
  a.btn--white {
    bottom: 235px;
  }

  /*下層_System*/
  .system_txt_area_kasou {
    margin: 5vw 2vw 0 2vw;
  }

  /*下層_Access*/
  .access_area {
    margin: 12vw 0 0 2vw;
  }
}

/*レスポンシブデザインここから(max-width:1500px)
======================================================
======================================================*/

@media(max-width:1500px){
  a.btn--white {
    bottom: 220px;
  }

  /*下層_System*/
  .system_txt_area_kasou {
    margin: 5vw 2vw 0 2vw;
  }

  /*下層_Access*/
  .access_area {
    margin: 12vw 0 0 2vw;
  }
}

/*レスポンシブデザインここから(max-width:1400px)
======================================================
======================================================*/

@media(max-width:1400px){
  a.btn--white {
    bottom: 210px;
  }

  /*下層_System*/
  .kasou_system_img {
    width: 500px;
  }
}

/*レスポンシブデザインここから(max-width:1300px)
======================================================
======================================================*/

@media(max-width:1300px){
  a {
    font-size: 2rem;
  }

  .menu-subtitle {
    font-size: 0.7em;
    padding: 0;
  }

  .access_btn, a.access_btn, button.access_btn {
    left: 39%;
  }

  a.btn--white {
    bottom: 200px;
  }

  /*下層_System*/
  .kasou_system_img {
    width: 500px;
    height: 300px;
    margin-top: 6vw;
  }

  .system_title_kasou {
    font-size: 4rem;
  }

  .system_txt_area_kasou {
    margin: 7vw 2vw 0 2vw;
  }

  /*下層_Access*/
  .access_area {
    margin: 12vw 0 0 2vw;
  }

}

/*レスポンシブデザインここから(max-width:1200px)
======================================================
======================================================*/

@media(max-width:1200px){

  .read_txt_1200 {
    display: block;
  }

  .read_txt {
    display: none;
  }

  .top_img_down {
    display: block;
  }

  .top_img_up {
    display: none;
  }

  .nav_list {
    gap: 12rem
  }

  .system_txt_area {
    margin: 3vw 2.5vw 0 2.5vw;
  }

  .system_img {
    width: 600px;
  }

  a.btn--white {
    bottom: 190px;
    left: 56vw;
  }

  .home_img03 {
    display: none;
  }

  .home_img03_1200 {
    display: block;
  }

  /*下層_System*/
  .kasou_system_img {
    margin-top: 9vw;
  }

  .access_area {
    margin: 8vw 0 0 2vw;
  }
}

/*レスポンシブデザインここから(max-width:1100px)
======================================================
======================================================*/

@media(max-width:1100px){
  a.btn--white {
    bottom: 175px;
  }

 small {
  margin-bottom: 15vw
}

  /*下層_System*/
  .system_title_kasou {
    font-size: 3.6rem;
  }

  /*下層_Access*/
  .access_img {
    width: 600px;
  }
}

/*レスポンシブデザインここから(max-width:1000px)
======================================================
======================================================*/

@media(max-width:1000px){
  .nav_list {
    gap: 9rem
  }

  .system_txt_area {
    margin: 0 2.5vw;
  }

  .system_img {
    width: 500px;
  }

  .system_flex {
    margin: 7vw 0;
  }

  .system_txt {
    font-size: 1.7rem;
  }

  a.btn--white {
    bottom: 165px;
  }

  .access_btn, a.access_btn, button.access_btn {
    left: 36%;
  }

}

/*レスポンシブデザインここから(max-width:900px)
======================================================
======================================================*/

@media(max-width:900px){
  .nav_list {
    gap: 7rem;
  } 

  .system_title {
    font-size: 5rem;
  }

  .access_btn, a.access_btn, button.access_btn {
    left: 34%;
  }

  .contact_btn, a.contact_btn, button.contact_btn {
    padding: 2rem 4rem;
  }

  a.btn--white {
    bottom: 143px;
  }

  /*下層_System*/
  .system_title_kasou {
    font-size: 3.3rem;
  }

  .system_txt {
    font-size: 1.5rem;
  }   

  /*下層_Access*/
  .contact_title_kasou {
    font-size: 2.3rem;
  }

  .contact_txt {
    font-size: 1.5rem;
  }
}

/*レスポンシブデザインここから(max-width:800px)
======================================================
======================================================*/

@media(max-width:800px){
  .nav_list {
    gap: 4rem;
  } 

  .system_img {
    width: 450px;
  }

  .btn, a.btn, button.btn {
    padding: 1rem 6rem;
  }

  .system_txt_area {
    margin: 0 0.5vw 0 3vw;
  }

  .access_title {
    margin: 2vw 0;
  }

  .access_btn, a.access_btn, button.access_btn {
    left: 31%;
  }

small {
  margin-bottom: 20vw
}

  /*下層_System*/
  .system_title_kasou {
    font-size: 3rem;
  }

  .system_img {
    width: 400px;
  }

  /*下層_System*/
  .access_img {
    width: 500px;
  }

}

/*レスポンシブデザインここから(max-width:700px)
======================================================
======================================================*/

@media(max-width:700px){
  .system_img {
    width: 400px;
  }

  .access_btn, a.access_btn, button.access_btn {
    left: 29%;
  }

  a.btn--white {
    bottom: 120px;
  }

  /*下層_System*/
  .kasou_system_img {
    margin-top: 13vw;
  }

  /*下層_System*/
  .access_img {
    width: 450px;
  }

  .system_title_kasou {
    font-size: 2.2em;
  }

}


/*レスポンシブデザインここから(max-width:660px)
======================================================
======================================================*/

@media(max-width:660px){

/*TOPページ
======================================================
======================================================*/

.top_img_down {
  display: none;
}

.top_img_660 {
  display: block;
}

.top_img_660_kasou {
  display: block;
}

.nav_list {
  display: none;
}

.read_txt_1200 {
  display: none;
}

.read_txt_660 {
  display: block;
  width: 100%;
}

/*System_area*/
.system_flex {
  display: block;
}

.system_txt {
  font-size: 2rem;
}

.system_img {
  margin-top: 3vw;
  width: 85%;
  margin-left: 13vw;
}

.btn, a.btn, button.btn {
  margin-left: 32vw;
}

.home_img02  {
  display: none;
}

.home_img02_660  {
  display: block;
  width: 100%;
}

.home_img03_1200 {
  display: none;
}

.home_img03_660 {
  display: block;
  width: 100%;
}

/*Contact_btn*/

a.btn--white {
  bottom: 190px;
  left: 21vw;
}

.contact_btn, a.contact_btn, button.contact_btn {
  padding: 4rem 7rem;
  font-size: 2.3rem;
}

/*footer*/
.footer_logo_660 {
  display: block;
  width: 60%;
  margin: 0 auto;
  margin-top: -10vw;
}


/*下層_system
======================================================
======================================================*/

.kasou_home {
  display: none;
}

.kasou_home_660 {
  display: block;
  width: 100%;
}

.system_title_kasou {
  font-size: 3em;
}

/*下層_Access
======================================================
======================================================*/

.access_img {
  width: 100%;
}

/*下層_Contact
======================================================
======================================================*/

.contact_title_kasou {
  font-size: 2.8rem;
  text-align: left;
  margin-left: 2vw;
}

.contact_txt {
  font-size: 2rem;
  text-align: left;
  margin-left: 2vw;
}

.Form {
  margin-left: 2vw;
  margin-right: 2vw;
}



/*共通箇所
======================================================
======================================================*/
/*ハンバーガーメニュー*/
/*ボタン外側※レイアウトによってpositionや形状は適宜変更してください*/
.openbtn{
	/*ボタン内側の基点となるためrelativeを指定。
追従するナビゲーションの場合はfixed＋top、rightといった位置をセットで指定*/
  display: block;
	position: fixed;
	background:#FFF100;
	cursor: pointer;
  width: 50px;
  height:50px;
	border-radius: 5px;
  top: 15px;
  right: 15px;
  z-index: 100;
}

/*ボタン内側*/

.openbtn .openbtn-area{
    transition: all .4s;
}

.openbtn span{
    display: inline-block;
    transition: all .4s;/*アニメーションの設定*/
    position: absolute;
    right: 14px;
    height: 3px;
    border-radius: 2px;
	background: #fff;
  	width: 45%;
  }


.openbtn span:nth-of-type(1) {
	top:15px;	
}

.openbtn span:nth-of-type(2) {
	top:23px;
}

.openbtn span:nth-of-type(3) {
	top:31px;
}

/*activeクラスが付与されると
線と周りのエリアが回転して×になる*/

.openbtn.active .openbtn-area{
	transform: rotateY(-360deg);
}

.openbtn.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-135deg);
    width: 30%;
}

.openbtn.active span:nth-of-type(2) {
	opacity: 0;
}

.openbtn.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(135deg);
    width: 30%;
}

/*メニューボタンCSS*/
.menu-content {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 80;
  background-color: #3584bb;
}
.menu-content ul {
  display: block;
  padding: 150px 10px 0;
}
.menu-content ul li {
  border-bottom: solid 1px #ffffff;
  list-style: none;
}
.menu-content ul li a {
  display: block;
  width: 100%;
  font-size: 25px;
  box-sizing: border-box;
  color:#ffffff;
  text-decoration: none;
  padding: 9px 15px 10px 0;
  position: relative;
}
.menu-content ul li a::before {
  content: "";
  width: 7px;
  height: 7px;
  border-top: solid 2px #ffffff;
  border-right: solid 2px #ffffff;
  transform: rotate(45deg);
  position: absolute;
  right: 11px;
  top: 16px;
}

.menu-content {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 100%;/*leftの値を変更してメニューを画面外へ*/
  z-index: 80;
  background-color: #3584bb;
  transition: all 0.5s;/*アニメーション設定*/
}
.menu-content.active {
	transform: translateX(-100%);
}

#menu-btn-check:checked ~ .menu-content {
  left: 0;/*メニューを画面内へ*/
}

.menu-subtitle {
  display: none;
}

h1 {
  display: none;
}

.nav_list li {
  padding-top: 0;
}

}

/*レスポンシブデザインここから(max-width:600px)
======================================================
======================================================*/

@media(max-width:600px){
  .btn, a.btn, button.btn {
    margin-left: 30vw;
  }

  .access_btn, a.access_btn, button.access_btn {
    left: 25%;
  }

  a.btn--white {
    left: 17vw;
  }
}

/*レスポンシブデザインここから(max-width:530px)
======================================================
======================================================*/

@media(max-width:530px){
  .btn, a.btn, button.btn {
    margin-left: 27vw;
  }

  .access_btn, a.access_btn, button.access_btn {
    left: 22%;
  }

  a.btn--white {
    left: 13vw;
    margin-top: 4vw;
  }

  /*下層_Contact*/
  .contact_title_kasou {
    font-size: 2.3rem;
  }

  .contact_txt {
    font-size: 1.7rem;
  }

.fixed_bottom {
    gap: 15px
}
}

/*レスポンシブデザインここから(max-width:470px)
======================================================
======================================================*/
@media(max-width:470px){
  .btn, a.btn, button.btn {
    margin-left: 23vw;
  }

  .access_btn, a.access_btn, button.access_btn {
    left: 18%;
  }

  a.btn--white {
    left: 14vw;
    margin-top: 10vw;
  }

  .contact_btn, a.contact_btn, button.contact_btn {
    padding: 3rem 4rem;
  }

  .footer_logo_660 {
    margin-top: -25vw
  }

  /*下層_Contact*/
  .contact_title_kasou {
    font-size: 2rem;
  }

  .Form-Item-Label-Required {
    padding-top: 5px;
    padding-bottom: 5px;
    width: 70px;
    font-size: 15px;
  }

  .access_btn, a.access_btn, button.access_btn {
    padding: 1rem 4rem;
    margin-left: 10vw;
  }
}

/*レスポンシブデザインここから(max-width:430px)
======================================================
======================================================*/
@media(max-width:430px){
  .btn, a.btn, button.btn {
    margin-left: 22vw;
  }

  .access_btn, a.access_btn, button.access_btn {
    left: 12%;
  }

  a.btn--white {
    left: 11vw;
    margin-top: 12vw;
  }

  .contact_btn, a.contact_btn, button.contact_btn {
    padding: 3rem 4rem;
  }

  .footer_logo_660 {
    margin-top: -25vw
  }

}

/*レスポンシブデザインここから(max-width:400px)
======================================================
======================================================*/
@media(max-width:400px){
  .btn, a.btn, button.btn {
    margin-left: 20vw;
    padding: 1rem 5rem;
  }

  .access_btn, a.access_btn, button.access_btn {
    left: 23%;
    padding: 1rem 5rem;
  }

  a.btn--white {
    left: 15vw;
    margin-top: 20vw;
  }

  .footer_logo_660 {
    margin-top: -30vw
  }

  .contact_btn, a.contact_btn, button.contact_btn {
    font-size: 2rem;
    padding: 2rem 2rem;
  }

small {
  margin-bottom: 26vw
}

  /*下層_Contact*/
  .contact_title_kasou {
    font-size: 1.7rem;
  }

  .contact_txt {
    font-size: 1.4rem;
  }

  .access_btn, a.access_btn, button.access_btn {
    padding: 1rem 3rem;
    margin-left: 4vw;
  }
}

/*レスポンシブデザインここから(max-width:370px)
======================================================
======================================================*/
@media(max-width:370px){
  .btn, a.btn, button.btn {
    margin-left: 17vw;
  }

  .access_btn, a.access_btn, button.access_btn {
    left: 10%;
  }

  a.btn--white {
    left: 14vw;
    margin-top: 21vw;
  }

  /*下層_Contact*/
  .access_btn, a.access_btn, button.access_btn {
    margin-left: 10vw;
  }
}

/*レスポンシブデザインここから(max-width:340px)
======================================================
======================================================*/
@media(max-width:340px){

  .system_title {
    font-size: 4rem;
  }

  .system_txt {
    margin: 7vw;
  }

  .access_title {
    font-size: 4rem;
  }

  .btn, a.btn, button.btn {
    margin-left: 14vw;
  }

  .access_btn, a.access_btn, button.access_btn {
    left: 15%;
    padding: 1rem 6rem;
  }

  a.btn--white {
    left: 18vw;
    margin-top: 26vw;
  }

  .contact_btn, a.contact_btn, button.contact_btn {
    font-size: 1.6rem;
    padding: 2rem 2rem;
  }

  .footer_logo_660 {
    margin-top: -38vw;
  }

  /*下層_System*/
  .system_title_kasou {
    font-size: 2.5em;
  }

  /*下層_Contact*/
  .contact_title_kasou {
    font-size: 1.5rem;
  }

  .access_btn, a.access_btn, button.access_btn {
    padding: 1rem 3rem;
    margin-left: 0;
  }
}

/*レスポンシブデザインここから(max-width:310px)
======================================================
======================================================*/
@media(max-width:310px){
  .access_btn, a.access_btn, button.access_btn {
    left: 14%;
  }

  a.btn--white {
    left: 15vw;
    margin-top: 31vw
  }
}