/*  기본값 초기화  */

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  word-break: break-all;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
span {
  z-index: 1;
}


body {
  line-height: 1;
  font-family: TossFaceFont, Noto Sans;
  font-style: normal;
  font-weight: 500;

  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

  overflow-x: hidden;
}

ol,
ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

a {
  text-decoration-line: none;
  text-decoration: none;
  color: inherit;

}

/* nav 관련 속성 */

.nav {
  width: 100%;
  justify-content: space-around;
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  background-color: #ffffff;
  z-index: 100;
}

.navbar_menu {
  display: flex;
  align-items: center;
  font-size: 15px;
  white-space: nowrap;
  padding-left: 0;
}


.navbar_item {
  align-content: center;
  padding: 0px 10px;
}

.navbar_item a {
  padding: 12px 10px;
  font-size: 14px;
  line-height: 20px;
  color: #4e5968;
}

.navbar_lang {
  display: flex;
  align-items: center;
}

/* mian 관련 속성 */

.main {
  height: 100%;
}

/* section1 */

.home1_wrap {
  position: relative;
  width: 100%;
}

.home1_container_css {
  height: 100vh;
  width: 100%;
  background:
    linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)),
    url('static/img/home1_backgrond.png') center/cover no-repeat;
  background-size: cover;
  position: relative;
}

.home1_container1 {
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
}

.home1_content {
  justify-content: center;
  align-content: center;
  opacity: 0;
}

.home1_text {
  font-size: 31px;
  text-align: center;
  margin-bottom: 50px;
  line-height: 1.4;
  white-space: wrap;
}

.home1_btn {
  display: flex;
  justify-content: center;
  word-break: keep-all;
}

.button_left {
  margin: 0px 6px 0px 0px;
}

.store_btn {
  background-color: rgba(0, 12, 30, 0.8);
  padding: 11px 16px 11px 14px;
  margin-left: 3px;
  margin-right: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  color: white;
  border-radius: 7px;
}

.home1_container2 {
  height: 220px;
  position: relative;
  display: flex;
  text-align: center;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.4;
  background: #f9fafb;
  padding: 200px 0;
  justify-content: center;
  white-space: wrap;
}


/* section2 */

.home2_wrap {
  position: relative;
  width: 100%;
}

.home2_container {
  padding: 250px 0 165px 0;
  position: relative;
  width: 100%;
  height: 1272px;
  margin: auto;
}

.home2_positionBox {
  position: relative;
  width: 80%;
  height: 100%;
  margin: 0 auto;
}

.home2_head {
  position: relative;
  white-space: wrap;
}

.home2_head1 {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  color: #3182f6;
  margin-bottom: 30px;
  white-space: wrap;
  word-break: keep-all;
}

.home2_head2 {
  position: relative;
  font-size: 50px;
  font-weight: 700;
  line-height: 1.4;
  color: #191f28;
  white-space: wrap;
  word-break: keep-all;
  z-index: 3;
}

.home2_mainImg_left_box {
  position: absolute;
  width: 600px;
  height: 936px;
  bottom: 0px;
  left: -104px;
  z-index: 2;
}

.home2_mainImg_shadow_left {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 22px;
  z-index: 1;
}

.home2_mainImg_left {
  position: absolute;
  bottom: 10%;
  left: 22%;
  width: 57%;
  height: auto;
  border-radius: 22px;
}


.home2_mainImg_right_box {
  position: absolute;
  width: 600px;
  height: 936px;
  top: 0px;
  right: -104px;
  overflow: hidden;
}

.home2_mainImg_shadow_right {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 22px;
  z-index: 1;
}

.home2_mainImg_right {
  position: absolute;
  top: 11%;
  left: 22%;
  width: 57%;
  height: auto;
  border-radius: 40px;
}

.home2_text {
  position: absolute;
  line-height: 1.5;
  font-weight: 500;
  font-size: 23px;
  right: 10px;
  bottom: 50px;
  white-space: wrap;
  color: rgb(51, 61, 75);
  z-index: 3;
}

/* ------------------------------------------------------- */

/* home3 */

.home3_wrap {
  position: relative;
  width: 100%;
  background-color: #f9fafb;
  ;
}

.home3_container {
  padding: 250px 0px 165px;
  position: relative;
  width: 100%;
  height: 100%;
  margin: auto;
}

.home3_contentBox {
  position: relative;
  width: 92%;
  height: 100%;
  margin: 0 auto;
}

.home3_head1 {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  color: #3182f6;
  margin-bottom: 30px;
}

.home3_head2 {
  font-size: 50px;
  font-weight: 700;
  line-height: 1.4;
  color: #191f28;
  margin-bottom: 80px;
  white-space: wrap;
}

.home3_main1 {
  padding: 0px;
  margin: 0px 0px 150px;
  display: flex;
  flex-wrap: wrap;
  width: calc(100% + 30px);
  justify-content: space-between;
  align-items: center;
}

.home3_main1_textBox {
  width: 556px;
  height: 100%;
  max-width: calc(50% - 30px);
  flex-basis: calc(50% - 30px);
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding-left: 38px;
  white-space: nowrap;
}

.home3_main1_text1 {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.4;
  color: rgb(49, 130, 246);

}

.home3_main1_text2 {
  margin-bottom: 20px;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.4;
  color: rgb(51, 61, 75);
}

.home3_main1_text3 {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.5;
  color: rgb(107, 118, 132);
}

.home3_main1_img {
  width: 100%;
  height: auto;
  max-width: calc(50% - 30px);
  flex-basis: calc(50% - 30px);
}

.home3_main2 {
  padding: 0px;
  margin: 0px 0px 150px;
  display: flex;
  flex-wrap: wrap;
  width: calc(100% + 30px);
  justify-content: space-between;
  align-items: center;
}

.home3_main2_textBox {
  width: 556px;
  height: 100%;
  max-width: calc(50% - 30px);
  flex-basis: calc(50% - 30px);
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding-left: 38px;
  word-break: break-word;
  white-space: nowrap;
}

.home3_main2_text1 {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.4;
  color: rgb(49, 130, 246);
}

.home3_main2_text2 {
  margin-bottom: 20px;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.4;
  color: rgb(51, 61, 75);
}

.home3_main2_text3 {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.5;
  color: rgb(107, 118, 132);
}

.home3_main2_img {
  width: 100%;
  height: auto;
  max-width: calc(50% - 30px);
  flex-basis: calc(50% - 30px);
}

.home3_main3 {
  padding: 0px;
  display: flex;
  flex-wrap: wrap;
  width: calc(100% + 30px);
  justify-content: space-between;
  align-items: center;
}

.home3_main3_textBox {
  width: 556px;
  height: 100%;
  max-width: calc(50% - 30px);
  flex-basis: calc(50% - 30px);
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding-left: 38px;
}

.home3_main3_text1 {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.4;
  color: rgb(49, 130, 246);

}

.home3_main3_text2 {
  margin-bottom: 20px;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.4;
  color: rgb(51, 61, 75);
}

.home3_main3_text3 {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.5;
  color: rgb(107, 118, 132);
}

.home3_main3_img {
  width: 100%;
  height: auto;
  max-width: calc(50% - 30px);
  flex-basis: calc(50% - 30px);
}


/* home4 */

.home4_wrap {
  position: relative;
  width: 100%;
}

.home4_container {
  padding: 250px 0px;
  position: relative;
  width: 100%;
  height: 100%;
  margin: auto;
}

.home4_contentBox {
  position: relative;
  width: 92%;
  height: 100%;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  flex-direction: column;

}

.home4_head {
  height: auto;
  margin-bottom: 210px;
  z-index: 1;
}

.home4_head1 {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  color: #3182f6;
  margin-bottom: 30px;
}

.home4_head2 {
  font-size: 50px;
  font-weight: 700;
  line-height: 1.4;
  color: #191f28;
  white-space: nowrap;
}

.home4_content1 {
  font-size: 48px;
  font-weight: 700;
  line-height: 1.5;
  color: rgb(51, 61, 75);
  white-space: pre-wrap;
}

.home4_content2 {
  font-size: 48px;
  font-weight: 700;
  line-height: 1.5;
  color: rgb(51, 61, 75);
  white-space: pre-wrap;
}

.home4_content3 {
  font-size: 48px;
  font-weight: 700;
  line-height: 1.5;
  color: rgb(51, 61, 75);
  white-space: pre-wrap;
  margin-bottom: 30px;
}

.home4_content4 {
  font-size: 23px;
  font-weight: 600;
  line-height: 1.5;
  color: rgb(51, 61, 75);
  white-space: pre-wrap;
}

.home4_imgBox {
  position: absolute;
  height: 100%;
  width: 400px;
  right: 200px;
}

.home4_imgCover {
  width: 600px;
  display: block;
}
.home4_imgContainer{
  position: absolute;
  left:130px;
  top:100px;
  width:330px;
  height:740px;
  overflow:hidden;
  border-radius:40px;
  display:flex;   
  float: none;       
}

.home4_track{
  width:100%;
  height:100%;
  display:flex;          
  transition: transform 600ms ease; 
  transform: translateX(0%);       
}

.home4_inner{
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
}

.home4_inner img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display:block;
}

/* home5 */


.home5_wrap {
  position: relative;
  width: 100%;
}

.home5_container {
  padding: 250px 0px;
  position: relative;
  width: 100%;
  height: 100%;
  margin: auto;
  background-color: #f9fafb;
}

.home5_positionBox {
  position: relative;
  width: 92%;
  height: 100%;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  flex-direction: column;

}

.home5_head {
  height: auto;
  z-index: 1;
}

.home5_head1 {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  color: #3182f6;
  margin-bottom: 30px;
}

.home5_head2 {
  font-size: 50px;
  font-weight: 700;
  line-height: 1.4;
  color: #191f28;
  white-space: nowrap;
  margin: 0px 0px 80px;
}

.home5_contentBox {
  display: flex;
  flex-wrap: wrap;
  width: calc(100% + 30px);
  margin: 0px -30px -30px 0px;
}

.home5_content1 {
  height: 400px;
  margin: 0px 30px 30px 0px;
  overflow: hidden;
  isolation: isolate;
  background-color: inherit;
  flex-basis: calc(50% - 30px);
  max-width: calc(50% - 30px);
  padding: 0px;
}

.home5_content1_img {
  width: 120px;
  margin-bottom: 30px;
}

.home5_content1_head {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.5;
  color: rgb(51, 61, 75);
  margin-bottom: 10px;
  white-space: pre-wrap;
}

.home5_content1_text {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.5;
  color: rgb(107, 118, 132);
  white-space: pre-wrap;
}

/* - */

.home5_content2 {
  height: 400px;
  margin: 0px 30px 30px 0px;
  overflow: hidden;
  isolation: isolate;
  background-color: inherit;
  flex-basis: calc(50% - 30px);
  max-width: calc(50% - 30px);
  padding: 0px;
}

.home5_content2_img {
  width: 120px;
  margin-bottom: 30px;
}

.home5_content2_head {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.5;
  color: rgb(51, 61, 75);
  margin-bottom: 10px;
  white-space: pre-wrap;
}

.home5_content2_text {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.5;
  color: rgb(107, 118, 132);
  white-space: pre-wrap;
}

/* - */

.home5_content3 {
  height: 400px;
  margin: 0px 30px 30px 0px;
  overflow: hidden;
  isolation: isolate;
  background-color: inherit;
  flex-basis: calc(50% - 30px);
  max-width: calc(50% - 30px);
  padding: 0px;
}

.home5_content3_img {
  width: 120px;
  margin-bottom: 30px;
}

.home5_content3_head {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.5;
  color: rgb(51, 61, 75);
  margin-bottom: 10px;
  white-space: pre-wrap;
}

.home5_content3_text {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.5;
  color: rgb(107, 118, 132);
  white-space: pre-wrap;
}

/* - */

.home5_content4 {
  height: 400px;
  margin: 0px 30px 30px 0px;
  overflow: hidden;
  isolation: isolate;
  background-color: inherit;
  flex-basis: calc(50% - 30px);
  max-width: calc(50% - 30px);
  padding: 0px;
}

.home5_content4_img {
  width: 120px;
  margin-bottom: 30px;
  transform: translate3d(0px, 0px, 0px);

}

.home5_content4_head {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.5;
  color: rgb(51, 61, 75);
  margin-bottom: 10px;
  white-space: pre-wrap;
}

.home5_content4_text {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.5;
  color: rgb(107, 118, 132);
  white-space: pre-wrap;
}

/* home6 */

.home6_wrap {
  position: relative;
  width: 100%;
}

.home6_container {
  padding: 250px 0px;
  position: relative;
}

.home6_headBox {
  width: 100%;
  height: 100%;
}

.home6_head {
  width: 92%;
  height: 100%;
  margin: 0px 44px 0px 44px;
}

.home6_head1 {
  margin-bottom: 30px;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  color: #3181f6;
}

.home6_head2 {
  font-size: 50px;
  font-weight: 700;
  line-height: 1.4;
  color: #191f28;
}

.home6_main {
  position: relative;
  width: 100%;
  margin-bottom: 12px;
}

.home6_imgBox {
  width: 600px;
  height: 936px;
  position: relative;
  margin: 0 auto;
}

.home6_img {
  position: absolute;
  top: 15%;
  left: 20%;
  width: 55%;
  height: auto;
  border-radius: 22px;
}

.home6_imgCover {
  position: relative;
  width: 100%;
  height: 100%;
}

.home6_textBox1 {
  position: absolute;
  left: 50%;
  display: flex;
  max-width: 900px;
  line-height: 1.5;
  color: #4e5968;
  top: 270px;
  -webkit-box-pack: end;
  justify-content: end;
  width: 100%;
  transform: translateX(-50%);
}

.home6_text_right {
  font-size: 23px;
  font-weight: 500;
  line-height: 1.5;
  color: rgb(51, 61, 75);
  max-width: 220px;
}

.home6_textBox2 {
  position: absolute;
  top: 460px;
  left: 50%;
  display: flex;
  max-width: 900px;
  line-height: 1.5;
  color: #4e5968;
  width: 100%;
  transform: translateX(-50%);
}

.home6_text_left {
  font-size: 23px;
  font-weight: 500;
  line-height: 1.5;
  color: rgb(51, 61, 75);
  max-width: 220px;
}

.home6_footerBox {
  max-width: 1140px;
  width: 100%;
  height: 100%;
  margin: auto;
}

.home6_footer_container {
  width: 92%;
  height: 100%;
  margin: 0px auto;
  text-align: center;
}

.home6_footer_text {
  font-size: 23px;
  font-weight: 600;
  line-height: 1.5;
  color: rgb(51, 61, 75);
}

/* home7 */

.home7_wrap {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding: 100px 0 250px 0;
  background-color: black;
}

.home7_imgBox {
  align-items: center;
  display: flex;
  flex-direction: row;
  justify-content: center;
  width: 100%;
}

.home7_img {
  display: block;
  width: 100%;
  margin-bottom: 11px;
}

/* .home7_textBox {} */

.home7_text1 {
  font-size: 60px;
  font-weight: 700;
  line-height: 1.4;
  color: #fff;
  margin-bottom: 21px;
  text-align: center;
  white-space: nowrap;
}

.home7_text2 {
  font-size: 30px;
  font-weight: 700;
  line-height: 1.4;
  color: #b0b8c1;
  margin-bottom: 200px;
  text-align: center;
}

.home7_content_container {
  display: flex;
  flex-direction: column;
  padding: 0px 48px;
  align-items: flex-start;
}

.home7_contentBox {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  width: 100%;
  align-items: flex-start;
  justify-content: center;
  -webkit-box-pack: center;
  white-space: pre-wrap;
  gap: 100px;
}

.home7_content1 {
  width: 100%;
  display: flex;
  flex-direction: column;
  max-width: 300px;
}

.home7_content1_head {
  padding-bottom: 12px;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}

.home7_content1_text {
  max-width: 300px;
  margin-bottom: 38px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.6;
  color: #b0b8c1;
}

.home7_content1_link {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  font-weight: 600;
  line-height: 18px;
  font-size: 15px;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 0 solid transparent;
  background-color: #3182f6;
  border-radius: 7px;
  color: white;
  padding: 11px 16px;
  width: 115px;
}

/*  */

.home7_content2 {
  width: 100%;
  display: flex;
  flex-direction: column;
  max-width: 300px;
}

.home7_content2_head {
  padding-bottom: 12px;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}

.home7_content2_text {
  max-width: 300px;
  margin-bottom: 38px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.6;
  color: #b0b8c1;
}

.home7_content2_link {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  font-weight: 600;
  line-height: 18px;
  font-size: 15px;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 0 solid transparent;
  background-color: #3182f6;
  border-radius: 7px;
  color: white;
  padding: 11px 16px;
  width: 115px;
}

/*  */

.home7_content3 {
  width: 100%;
  display: flex;
  flex-direction: column;
  max-width: 300px;
}

.home7_content3_head {
  padding-bottom: 12px;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}

.home7_content3_text {
  max-width: 300px;
  margin-bottom: 38px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.6;
  color: #b0b8c1;
}

.home7_content3_link {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  font-weight: 600;
  line-height: 18px;
  font-size: 15px;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 0 solid transparent;
  background-color: #3182f6;
  border-radius: 7px;
  color: white;
  padding: 11px 16px;
  width: 115px;
}

/*  */

.home7_content4 {
  width: 100%;
  display: flex;
  flex-direction: column;
  max-width: 300px;
}

.home7_content4_head {
  padding-bottom: 12px;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}

.home7_content4_text {
  max-width: 300px;
  margin-bottom: 38px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.6;
  color: #b0b8c1;
}

.home7_content4_link {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  font-weight: 600;
  line-height: 18px;
  font-size: 15px;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 0 solid transparent;
  background-color: #3182f6;
  border-radius: 7px;
  color: white;
  padding: 11px 16px;
  width: 115px;
}

/*  */

/* home8 */

.home8_wrap {
  position: relative;
  width: 100%;
  display: flex;
  overflow: hidden;
  flex-direction: column;
  align-items: center;
  padding: 33px 0px;
  background-color: #f5f6f8;
}

.home8_container {
  align-items: center;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.home8_content {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.home8_content_head {
  font-size: 36px;
  font-weight: 700;
  line-height: 1.3;
  color: #333d4b;
  margin-bottom: 16px;
}

.home8_content_text {
  margin-bottom: 24px;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.5;
  color: rgba(0, 19, 43, 0.58)
}

.home8_content_link {
  color: #1b64da;
  background-color: #e8f3ff;
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  line-height: 18px;
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 0 solid transparent;
  border-radius: 7px;
  padding: 11px 16px;
}

.home8_imgBox {
  width: 240px;
  background-color: transparent;
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  vertical-align: top;
}

.home8_img {
  width: 100%;
  height: 100%;
}


/* footer 관련 속성 */

.footer {
  background-color: #f9fafb;
  padding: 50px 0 100px;
  display: block;
}

.footer_container {
  position: relative;
  max-width: 1064px;
  margin: auto;
  padding: 0 67px;
  box-sizing: border-box;
}

.footer_siteBox {
  display: flex;
  padding-bottom: 50px;
  white-space: nowrap;
  word-break: break-all;
  cursor: pointer;
}

.footer_site1 {
  padding-right: 20px;
  width: fit-content;
  margin: 0;
  color: rgb(172, 172, 172);
  list-style: none;
  font-size: 15px;
  line-height: 30px;
  box-sizing: border-box;
}

.footer_site2 {
  padding-right: 20px;
  width: fit-content;
  margin: 0;
  color: rgb(172, 172, 172);
  list-style: none;
  font-size: 15px;
  line-height: 30px;
  box-sizing: border-box;
}

.footer_site3 {
  padding-right: 20px;
  width: fit-content;
  margin: 0;
  color: rgb(172, 172, 172);
  list-style: none;
  font-size: 15px;
  line-height: 30px;
  box-sizing: border-box;
}

.footer_site4 {
  padding-right: 20px;
  width: fit-content;
  color: rgb(172, 172, 172);
  list-style: none;
  font-size: 15px;
  line-height: 30px;
  box-sizing: border-box;
}

.footer_site5 {
  padding-right: 20px;
  width: fit-content;
  margin: 0;
  color: rgb(172, 172, 172);
  list-style: none;
  font-size: 15px;
  line-height: 30px;
  box-sizing: border-box;
}

.footer_site1_1,
.footer_site2_1,
.footer_site3_1,
.footer_site4_1,
.footer_site5_1 {
  color: #333d4b;
  font-weight: 700;
  padding-bottom: 5px;
}

.footer_address {
  color: #8b95a1;
  font-size: 13px;
  font-style: normal;
  line-height: 20px;
  white-space: pre-wrap;
}

.footer_address_head {
  display: block;
  /* padding-bottom: 16px; */
  color: #333d4b;
  font-size: 15px;
}

.footer_etc {
  display: inline-grid;
  grid-template-columns: repeat(4, auto);
  column-gap: 34px;
  row-gap: 4px;
  margin: 0;
  padding: 24px 0 30px;
  list-style: none;
}

.footer_etc>li {
  color: #6b7684;
  font-size: 13px;
  line-height: 18px;
  text-decoration: none;
}

.end {
  display: flex;
  padding: 0;
}

.end>li {
  margin-right: 8px;
}

.end>a {
  cursor: pointer;
  display: inline-block;
  width: 36px;
  height: 36px;
  border-radius: 50%;
}

.end>img {
  display: block;
  width: 100%;
  height: 100%;
}

.reveal {
  opacity: 0;
  transform: translateY(60px);
  transition: opacity 1300ms ease, transform 1400ms ease;
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
} 

.delay-250  { transition-delay: 250ms; }
.delay-500  { transition-delay: 500ms; }
.delay-750  { transition-delay: 750ms; }
.delay-1000 { transition-delay: 1000ms; }
.delay-1500 { transition-delay: 1500ms; }
.delay-2000 { transition-delay: 2000ms; }