/* font */
@font-face {
  font-family: 'He';
  src: url('./../font/HelveticaNeueLTPro-Bd.woff') format('woff');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'He';
  src: url('./../font/HelveticaNeueLTPro-BdEx.woff') format('woff');
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: 'He';
  src: url('./../font/HelveticaNeueLTPro-Ex.woff') format('woff');
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'He';
  src: url('./../font/HelveticaNeueLTPro-Hv.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'He';
  src: url('./../font/HelveticaNeueLTPro-Lt.woff') format('woff');
  font-weight: 300;
  font-style: normal;
}

/* 2 */
@font-face {
  font-family: 'st';
  src: url('./../font/SUIT-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'st';
  src: url('./../font/SUIT-ExtraBold.woff') format('woff');
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: 'st';
  src: url('./../font/SUIT-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'st';
  src: url('./../font/SUIT-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'st';
  src: url('./../font/SUIT-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}

:root {
  --pr : #6200FF;
  --pr2 : #02f359;
  --black : #000;
  --gray_4a : #4a4a4a;
  --gray_c4 : #c4c4c4;
  --gray_e4 : #e4e4e4;
  --gray_70 : #707070;
  --gray_E8 : #E8E8E8;
  --wt : #fff;
  --wt_f5 : #f5f5f5;
}

html {scroll-behavior: smooth;}
html.hidden {overflow: hidden !important;}
body {font-family: 'st'; overflow-x: hidden; cursor: none ;}
input,textarea,select {font-family: 'st';}
body.hidden {overflow: hidden !important;}
section {position: relative; z-index: 2;}
/* font-event */
.font_h {font-family: 'He'; letter-spacing: -0.05em; transform: scaleY(0.8) !important;}
/* //font-event */

.container {max-width: 1420px; width: 100%; height: auto; margin: 0 auto; box-sizing: border-box; overflow: hidden;}

/* sec-tit */
.sec-tit {font-family: 'st';}
.sec-tit .tit {font-size: 90px; font-weight: 500; line-height: 1.17; letter-spacing: -1.8px; color: var(--black);}
.sec-tit .sub {font-size: 28px; font-weight: 300; line-height: 1.43; letter-spacing: -0.56px; color: var(--black);}

/* mouse_move */
.mouse_move {position: absolute; top: 0; left: 0; z-index: 9999; pointer-events: none;}
.mouse_move p {width: 28px; height: 28px; background: var(--black); border-radius: 100%; transition: all .5s; font-size: 22px; font-weight: 400; color: var(--wt); opacity: 0.8; white-space: nowrap;}
.mouse_move p.click {display: flex; align-items: center; justify-content: center; width: 130px; height: 130px; transition: all .5s;}
.mouse_move p.black {background: var(--wt); color: var(--black);}
.mouse_move p.black2 {background: var(--wt); color: var(--black);}
input,textarea,a,button {cursor: none;}

/* go_top */
.go_top {position: fixed; bottom: 147px; right: 140px; z-index: 10; display: flex; flex-flow: column; align-items: flex-end;}
.go_top > a {display: block; width: 60px; height: auto; margin-bottom: 30px;}
.go_top > a img {width: 100%; height: auto;}
.go_top .q_menu {display: flex; align-items: center; flex-flow: row-reverse; width: 60px; padding: 5px 10px; background: var(--wt); box-sizing: border-box; border-radius: 30px; overflow: hidden; transition: all .5s;}
.go_top .q_menu.active {width: 100%; transition: all .5s;}
.go_top .q_menu button {min-width: 60px; width: 60px; height: auto; margin: -5px 0; margin-left: 4px; margin-right: -10px;}
.go_top .q_menu button img {width: 100%; height: auto;}
.go_top .q_menu .menu-link {display: flex; align-items: center; gap: 17px;}
.go_top .q_menu .menu-link a {display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 100%; font-size: 17px; font-weight: bold; color: var(--black); text-transform: uppercase; background: url(./../img/sns_hover.png) no-repeat 50% 50%; background-size: cover;}