@charset "utf-8";

/* Root */
:root{
  --main_pink:#EB083C;
  --sub_pink:#FA3C4C;
  --orange:#EA5D25;
  --green:#169C84;
  --yellow:#FEE500;
  --light_pink:#FEF2F2;
  --text_black:#1A1A1A;
  --text_normal:#333333;
  --text_gray:#909090;
  --line_gray:#E8E8E8;
  --bg-white:#fff;
  --bg-gray:#fbfbfb;  
  --bg-gray2:#efefef;
  --bg_pink:#FFE9EA;
  --d_gray:#DDDDDD;

  --opacity_main:rgba(235, 8, 60, 0.1);
  --opacity_orange:rgba(234, 93, 37, 0.1);
  --opacity_green:rgba(22, 156, 132, 0.1);
  --shadow:0px 0px 9px rgb(122 122 122 / 10%);

  --filter_main:invert(16%) sepia(99%) saturate(7492%) hue-rotate(342deg) brightness(94%) contrast(96%);
  --filter_sub:invert(47%) sepia(100%) saturate(4080%) hue-rotate(332deg) brightness(106%) contrast(118%);

  --fs16:1.6rem;
  --fs18:1.8rem;
  --fs25:2.5rem;
  --fs35:3.5rem;
}

/* ---- 공용 CSS ---- */
body {overflow-x: hidden; /*background: var(--bg-gray);*/}

/* height */
.max_h{height: max-content !important;}
/* width */
.full_w {width:-webkit-fill-available;}

/* text */
.titleArea {font-size: 2rem; font-weight:bold; margin-bottom:3rem; white-space: nowrap; line-height: 1.5;}
.subtitle {font-size:var(--fs18); font-weight:bold; white-space: nowrap;}
.unmtxt {font-size: 1.2rem;}
.inputtext {font-size: var(--fs16); color:var(--main_pink); margin: 0.5rem 3rem 2rem;}
.importext {font-size: var(--fs16); font-weight: bold; color:var(--main_pink); margin-bottom: 2rem; line-height: 1.3;}
.fs14{font-size: 1.4rem;}
.fs16{font-size: var(--fs16);}
.fs18{font-size:var(--fs18);}

/* text_style */
.t_start {text-align: start !important;}
.t_end {text-align: end !important;}

.m_bold{font-weight: 400;}
.bold {font-weight: bold;}
.l_bold{font-weight: 700;}

.lh15 {line-height: 1.5;}

/* flex */
.flex {display: flex; align-items: center; justify-content: space-between;}
.flex_02 {display: flex; align-items: center; justify-content: center;}
.flex_start {justify-content: flex-start;} 
.flex_end {justify-content: flex-end;} 

/* margin */
.mr5 {margin-right: 0.5rem;}
.mr10 {margin-right: 1rem;}

.ml3 {margin-left: 0.3rem;}
.ml5 {margin-left: 0.5rem;}
.ml10 {margin-left: 1rem !important;}
.ml20 {margin-left: 2rem;}
.ml30 {margin-left: 3rem;}

.mt18 {margin-top:1.8rem;}
.mt30 {margin-top:3rem;}

.mb10 {margin-bottom:1rem !important;}
.mb20 {margin-bottom:2rem;}
.mb30 {margin-bottom:3rem;}
.mb50 {margin-bottom:5rem;}

.mx10 {margin:0 1rem;}

/* padding */
.p15 {padding:1.5rem !important;}
.py5 {padding:0 0.5rem !important;}

/* color */
.black{color:var(--text_black);}
.b_normal{color:var(--text_normal) !important;}
.gray {color: var(--text_gray) !important;}
.m_pink {color:var(--main_pink) !important;}
.green{color:var(--green) !important;}
.bg_gray2 {background:var(--bg-gray2);}

.color_p { border:1px solid var(--main_pink) !important; color:var(--main_pink) !important; background:var(--opacity_main) !important; }
.color_o { border:1px solid var(--orange) !important; color:var(--orange) !important; background:var(--opacity_orange) !important; }
.color_g { border:1px solid var(--green) !important; color:var(--green) !important; background:var(--opacity_green) !important; }

/* border */
.bd_B01 {border-bottom: 1px solid var(--line_gray);}

/* display */
.br_425 {display:none;}

.dp_none {display:block !important;}
.dp_block {display:none !important;}

/* etc */
.cs_p {cursor:pointer;}
.opacity0 {opacity:0;}
.box_style {padding:3rem; border:1px solid var(--bg-white); box-shadow: var(--shadow); border-radius: 10px; margin-bottom:3rem;}

#accent {accent-color: var(--main_pink);}

/* table */
.tableArea {width:100%; overflow-x: auto;}
.tableArea .tg{width:100%; text-align: center;}
.tableArea .tg tr{border-bottom:1.5px solid var(--d_gray); background: var(--bg-white);}
.tableArea .tg thead th {font-size: var(--fs16); font-weight: 500; color:var(--text_gray); padding:1.1rem ; background: var(--bg-white);}
.tableArea .tg tbody td {font-size: 1.4rem; font-weight: 400; color:var(--text_black); padding:1.1rem;background: var(--bg-white);}

.tableArea02 {width:100%; overflow-x: auto;}
.tableArea02 .tg {width:100%; text-align: center; border-top: 1px solid var(--d_gray);}
.tableArea02 .tg tr{border-bottom:1.5px solid var(--d_gray);}
.tableArea02 .tg th, .tableArea02 .tg td {width:25%; padding: 1.1rem 0.5rem; white-space: nowrap;}
.tableArea02 .tg thead th:nth-child(odd) {font-size: var(--fs16); font-weight: 500; color:var(--text_gray); background:var(--bg-gray2);}
.tableArea02 .tg thead th:nth-child(even) {font-size: 1.4rem; font-weight: 400; color:var(--text_black); background: var(--bg-white);}
.tableArea02 .tg tbody td:nth-child(odd) {font-size: var(--fs16); font-weight: 500; color:var(--text_gray); background:var(--bg-gray2);}
.tableArea02 .tg tbody td:nth-child(even) {font-size: 1.4rem; font-weight: 400; color:var(--text_black); background: var(--bg-white);}


/* button */
.btn.btn_01 {color: var(--bg-white); background: var(--main_pink);}
.btn.btn_02, .btn.btn_02__1 {color: var(--main_pink) ; background: var(--bg-white); border:1px solid var(--main_pink);}
.btn.btn_01 {color: var(--bg-white); background: var(--main_pink);}

.btn.btn_03 {color: var(--bg-white); background: var(--text_gray); border:1px solid var(--text_gray);}
.btn.btn_04 {color: var(--text_gray); background: var(--bg-white); border:1px solid var(--text_gray);}
.btn.btn__04 {color: var(--text_gray); background: var(--bg-white); border:1px solid var(--text_gray);}
.btn.btn_05 {color: var(--text_normal); width:10%; margin:0 3rem; border:1px solid var(--d_gray); white-space:nowrap}
.btn.btn_06 {padding: 0.5rem 2rem; color:var(--text_gray); border:1px solid var(--d_gray); white-space:nowrap}
.btn.btn_06.style2 {padding: 0.5rem 1rem; border-color:var(--main_pink); color:var(--main_pink); background:var(--opacity_main); }
.btn.btn_07 {position:relative; background:var(--yellow); color:var(--text_normal);}
.btn.btn_01, .btn.btn_02, .btn.btn_03, .btn.btn_04, .btn.btn__04, .btn.btn_05, .btn.btn_06, .btn.btn_07  {padding: 1.2rem 2rem; border-radius: 5px; font-size: var(--fs16); }
.btn_type1 {padding:1.2rem 5rem !important;}


.btn.btn_01.on {color: var(--sub_pink) ; background: var(--bg-white); border:1px solid var(--sub_pink); }
.btn.btn_02.on, .btn.btn_02__1.on  {color: var(--bg-white); background: var(--sub_pink);}
.btn.btn_04.on {color: var(--bg-white); background: var(--text_gray); border:1px solid var(--text_gray);}
.btn.btn__04.on {color: var(--text_gray); border:1px solid var(--text_gray);}
.btn.btn_07.on {background:var(--bg-white); border:1px solid var(--line_gray);}

.butArea {margin-top:2rem;}
.butArea .butbox >* {margin-right:2rem;}
.butArea .butbox >*:last-child {margin-right:0;}

/* img */
.imgArea {display: flex; flex-flow: row wrap; align-items: center;}
.imgArea >* {margin-right: 2rem;} 
.imgArea >*:last-child {margin-right: 0;} 
/* ---- 공용 CSS_End ---- */


/* ---- Header-Start ---- */
#top_header{position: fixed; z-index:1; display:flex; justify-content: space-between; align-items: center; width: 100%; height: 8rem; color:var(--text_gray); }

#top_header .head_logo {width: 25.3rem; height: 100%; padding:2rem 65px; margin:0 2rem; border-bottom:1px solid var(--line_gray); position:relative; background:var(--bg-white); -webkit-box-align: center; display: -webkit-box;}

/* header_menu */
.head_box {display:flex; align-items: center;  justify-content: flex-end; border-bottom:1px solid var(--line_gray); border-left:1px solid var(--line_gray); width:100%; height:100%; padding:0 30px; font-size: var(--fs16);  background:var(--bg-gray);}
.head_box ul {display:flex; }
.head_box ul {margin-right:3rem;}

.headmenu {display:flex;}
.headmenu li:hover a {color:var(--main_pink); font-weight: 500;}
.headmenu li {margin-right:3rem;}

/* header_icon */
.head_box {position:relative;}
.head_box .headicon .bell {position:relative; padding-top: 0.2rem;}
.head_box .headicon .bell::after {position:absolute;content: ''; width:5px; height:5px; background:var(--main_pink); border-radius: 100px; top:20%; right:10%}
.head_box .headicon li.user {margin-left: 10px;}

/* header_user */
.user_setting {position:absolute; bottom:-270%; right:1.8%; background:var(--bg-white); border:1px solid var(--light_pink); border-radius:20px; padding:2rem 0; display: none;}
.user_setting .userbox {display:flex; flex-flow:column; margin:0;}
.user_setting .userbox li .user_item {display:flex; padding:1rem 2.8rem; align-items:center;} 
.user_setting .userbox li .user_item span {margin-left:0.5em;}
.user_setting .userbox li:hover .user_item {filter:var(--filter_main);}
.user_setting .userbox li .user_item.on {background:var(--light_pink); color:var(--text_black); filter:none;}
.user_setting .userbox li .user_item.on > img {filter: invert(100%) sepia(0%) saturate(3270%) hue-rotate(183deg) brightness(81%) contrast(80%);}
/* ---- Header-End ---- */



/* ---- Accordion menu-Start ---- */
#section {display: flex; width: 100%; height: -webkit-fill-available; position: relative;}
#section .acco_wrap {width: 100%; height: 100%; max-width: 27.5rem;  overflow: hidden; position: fixed;}
#section .menu_Area {height: 100%;}

/* userBox */
#section .userBox {margin-top: 8rem; padding: 3rem 0;}
#section .userBox .user_img { margin-bottom: 2rem; display: flex; align-items: center; justify-content: center;}
#section .userBox .user_txt {text-align: center;}
#section .userBox .user_txt h2 {font-size: 2.4rem; font-weight: 600;}
#section .userBox .user_txt p {font-size: var(--fs16); padding-bottom:3rem; border-bottom: 1px solid var(--line_gray);  margin:0 2rem;}

/* accordion main */
#section .menu {padding-left: 3rem;}
#section .menu li {margin-bottom:3rem;}
#section .menu li a {width: 100%; display: block; font-size:var(--fs18); display: flex; align-items: center;  gap: 1rem; color: var(--text_gray); position:relative;}

/* accordion -> on */
#section .menu li a.on {color:var(--main_pink); font-weight: 500; }
#section .menu li a.on::after {position:absolute; content: ''; width:2px; height: 20px; border-radius: 50px; background: var(--main_pink); right: 0;}
#section .menu li a.on img {filter: var(--filter_main);}

/* accordion sub */
#section .menu li div {display: none; margin-top:1rem; line-height: 2; color:var(--text_gray);}
#section .menu li div p {width: 100%; padding: 0.2rem 3rem; font-size: var(--fs16);}

/* accordion sub->active */
#section .menu li div p.active {background-color: var(--opacity_main); color: var(--main_pink); font-weight: 500;}

/* accordion mobile menu */
#menu-bar { width: 20px; height: 20px; margin: 15px 0 0 0; cursor: pointer; display: none;}
.bar {height: 2px; width: 100%; background-color: var(--text_gray); display: block; border-radius: 5px; transition: 0.3s ease;}
#bar1 {transform: translateY(-4px);}
#bar3 {transform: translateY(4px);}

.mobile_menu_Area {display: none; transition: 0.3s ease;}

#section .acco_wrap_mobile {z-index: -10;}
.change .bar {background-color: #969696;}
.change #bar1 {transform: translateY(3px) rotateZ(-45deg);}
.change #bar2 {opacity: 0;}
.change #bar3 {transform: translateY(-1px) rotateZ(45deg);}
.change-bg {transform: translate(-60%, -30%); top: 35.5%; right: -5.2%;}

#section .mobile_menu_Area { height: 100%; background: var(--bg-white);}
/* ---- Accordion menu-End ---- */



/* ---- Dashboard-Start ---- */
#board_wrap {margin-top: 8rem; margin-left: 27.5rem; padding:3rem; width:100%; height: 100%; background:var(--bg-gray); border-left:1px solid var(--line_gray); overflow: hidden;}
#section .dashboard_wrap .board_flex {display:flex; flex-flow: row wrap; justify-content: space-between; align-items:flex-start;}
#section .dashboard_wrap .board_flex > * {width:calc((100% - 30px )/3); margin-bottom:3rem; padding:2rem; background:var(--bg-white); box-shadow: var(--shadow); border-radius: 1.5rem ;}

/* img */
#section .dashboard_wrap .board_flex .boardbox .boardimg {display:flex; flex-flow: row; align-items: center; }
#section .dashboard_wrap .board_flex .boardbox .boardimg span {font-weight: 600; font-size:var(--fs18); margin-left: 1rem;}

/* text */
#section .dashboard_wrap .board_flex .boardbox .boardtext .text {display:flex; align-items: flex-end; justify-content: end; }
#section .dashboard_wrap .board_flex .boardbox .boardtext h2 {font-size: 3.5rem; color:var(--main_pink); position: relative;}
#section .dashboard_wrap .board_flex .boardbox .boardtext h2::after {position:absolute; content: ''; bottom:0; left:0; width:100%; height: 3px; border-radius: 50px; background: var(--main_pink);}
#section .dashboard_wrap .board_flex .boardbox .boardtext small {font-size:2.5rem; color:var(--text_black); }
#section .dashboard_wrap .board_flex .boardbox .boardtext .free {color:var(--text_gray); font-size: var(--fs16);}

/*box */
#section .dashboard_wrap .board_flex .boardbox .box {display: flex; align-items: center; color:var(--text_black); font-size: 1.2rem; font-weight: 400; justify-content: flex-end; text-align: center;}
#section .dashboard_wrap .board_flex .boardbox .box div:nth-child(2) {margin:0 2rem; font-size: 2rem;}
#section .dashboard_wrap .board_flex .boardbox .box.style2 div:nth-child(2) {margin:0 1rem; font-size: 2.5rem;}
#section .dashboard_wrap .board_flex .boardbox .box .store span {border:1px solid var(--main_pink); padding:01rem 0.6rem; border-radius: 50px;font-size: var(--fs16);}
#section .dashboard_wrap .board_flex .boardbox .box .store p {line-height: 1.5; margin-top:1.3rem;}

/* category */
#section .dashboard_wrap .board_flex .boardbox .category_box {display: flex; flex-flow:row; margin-top:0.5rem; justify-content: space-between;}
#section .dashboard_wrap .board_flex .boardbox .category_box >* {width:calc((100% - 20px) /3);display: flex; align-items: center; padding:0.75rem 1.8rem; background:var(--light_pink); border-radius: 10px; }
#section .dashboard_wrap .board_flex .boardbox .category .img {width:4.5rem; height: 4.5rem; padding:1rem 0; border-radius: 50px; border:1px solid var(--text_black); text-align: center; font-size: 1rem; font-weight: 500;}
#section .dashboard_wrap .board_flex .boardbox .category .img img {margin:0 auto;}
#section .dashboard_wrap .board_flex .boardbox .category .num {font-size: var(--fs16); font-weight: 500; color: var(--main_pink); margin-left: 1rem;}
/* ---- Dashboard-End ---- */

/* ---- Login-Start ---- */
#top_header.log {border-bottom:1px solid var(--line_gray); background:var(--bg-white);}
#top_header.log .head_logo {border:0;}
#top_header.log .head_box {border:0; background:inherit;}
#top_header.log .head_box .btn.btn_01 {font-weight: 500; padding:1.2rem 4rem;}
#top_header.log .head_box .btn.btn_01 .dp_none{display: block !important;}
#top_header.log .head_box .btn.btn_01 .dp_block{display: none !important;}

#section.Log {display: -webkit-box; background: var(--bg-gray);}

.logWrap {width: 450px; height: fit-content; margin:auto;  padding:8rem 4rem; border-radius: 1rem; background:var(--bg-white); box-shadow: var(--shadow); }
.logWrap .loginArea {/*min-width: 300px; max-width: 450px;*/ margin-bottom:4rem}
.logWrap .loginArea .form_group {position: relative; font-size: var(--fs16); color: var(--text_gray);}
.logWrap .loginArea .form_group + .form_group {margin-top: 3rem;}
.logWrap .loginArea .form_group .form_label {position: absolute; z-index: 1; left: 0; top: 5px; transition: 0.3s;}
.logWrap .loginArea .form_group .form_control {width: 100%; position: relative; z-index: 3; height: 35px; background: none; border: none; padding: 5px 0; transition: 0.3s; border-bottom: 1px solid var(--line_gray); color: var(--text_gray);}
.logWrap .loginArea .form_group .form_control:invalid {outline: none;}
.logWrap .loginArea .form_group .form_control:focus, .loginArea .form_group .form_control:valid {outline: none; box-shadow: 0 1px var(--main_pink); border-color: var(--main_pink); font-size: var(--fs16);}
.logWrap .loginArea .form_group .form_control:focus + .form_label, .loginArea .form_group .form_control:valid + .form_label {font-size: 1.4rem; color: var(--main_pink); transform: translateY(-15px);}
.input_box input[type="tel"], 
.input_box input[type="text"] ,
.input_box input[type="email"] ,
.input_box input[type="password"] {width:-webkit-fill-available; color: var(--text_gray); border: none; border-bottom: 1px solid var(--line_gray); padding:1.6rem 0; font-size: 1.6rem; font-weight: 400;}
.input_box input[type="tel"]:focus, 
.input_box input[type="text"]:focus ,
.input_box input[type="email"]:focus ,
.input_box input[type="password"]:focus {color:var(--text_black); outline: none;}

.logWrap #log .flex {margin:2rem 0 3rem;}
.logWrap #log .flex input[type="checkbox"] {appearance: none; width:16px; height: 16px; border: 1px solid var(--line_gray); box-sizing: border-box; outline: 0; border-radius: 4px; margin-right: 0.5rem;}
.logWrap #log .flex input[type="checkbox"]:checked {background:var(--main_pink); background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");}
.logWrap .log_box .btn {margin-bottom:1.5rem;}

.logWrap .log_box {margin-bottom:4rem;}
.logWrap .log_box .unmtxt {cursor: pointer;}
.logWrap .simple {position:relative;}
.logWrap .simple .btn.btn_07::before {position: absolute; content: ''; background:url('../image/kakao_logo.svg') no-repeat center ; 
background-size: cover; width:16px; height:16px; left: 10%;}

/* singup */  
.logWrap.sing {position:relative; padding:4rem 4rem 6rem;}
.btn.re_btn {position:absolute; top:4.5%; font-size: 1.8rem; cursor: pointer; color:var(--text_black); transition: all 0.3s ease-in; 
padding: 1.5rem 2rem; border-radius: 4px;}
.btn.re_btn.on {color:var(--main_pink); background:var(--bg_pink);}
.btn.re_btn.on i {color:var(--main_pink); }
.logWrap .logtitle {font-size: var(--fs35); font-weight: 600; color: var(--text_black); margin-bottom:5rem; text-align: center;}
.singwrap .input_box {margin-bottom:1rem;}
.singwrap .input_box p {font-size: 1.4rem;}

#logUser {display:flex; align-items: center; position: relative;}
#logUser .input_box {width:-webkit-fill-available; margin-left: 1rem; }
#logUser .input_box input {padding:1.6rem 0; height: auto;}
#logUser .btn.btn_02 {position:absolute; top:25%; right:0; white-space: nowrap; background: var(--bg_pink); font-weight: bold; padding:0.75rem 1.5rem;}

/* input message */
.input-status-message {font-size: 1.4rem; line-height: 1.3; }
.input-with-message ~ .input-status-message {
  color:var(--main_pink); display:none; }
.input-with-message.focused:placeholder-shown:not(:focus) ~ .input-status-message--empty { display:block;}
.input-with-message:invalid ~ .input-status-message--invalid {display:block;}

/* sing_Selet */
.logWrap .singwrap .phone {margin:5rem 0;}
.logWrap .singwrap .phone .select {-webkit-appearance: none; -moz-appearance: none; appearance: none; border:0 none; color: var(--d_gray); width: inherit; height: -webkit-fill-available; padding: 1rem 2.5rem 1rem 1rem; font-size: var(--fs16); background: url(../image/search_icon.svg) no-repeat 100% 50%; border: 1px solid var(--line_gray);
  border-radius: 5px;}
.logWrap .singwrap .phone select::-ms-expand{display:none;}
.logWrap .singwrap .phone .select:focus {border-color:var(--main_pink); outline: none;  color:var(--text_gray);}
.logWrap .singwrap .phone .select option{padding:1rem; border: 1px solid var(--light_pink);}

/* sing_Input */
.singwrap .input_box input[type="tel"], 
.singwrap .input_box input[type="text"] ,
.singwrap .input_box input[type="email"] ,
.singwrap .input_box input[type="password"] {opacity: 50%; padding: 1.4rem 0;}
.singwrap .input_box input[type="tel"]:focus, 
.singwrap .input_box input[type="text"]:focus ,
.singwrap .input_box input[type="email"]:focus ,
.singwrap .input_box input[type="password"]:focus {color:var(--text_black); outline: none; opacity: 100%;}

/* ---- Login-End ---- */





/* ---- media-Start ---- */
@media (max-width:1600px){
  #board_wrap {margin-left: 27rem;}
}
@media (max-width: 1400px) {
  /* 공통 css */
  .dp_none {display: none !important;}
  .dp_block {display: block !important;}
  
  /* Header */
  #top_header {background: var(--bg-gray); border-bottom: 1px solid var(--line_gray);}
  #top_header .head_logo {background:inherit; border:0; padding: 1rem 55px; margin:0;}
  .head_box {border:0;}
  .headmenu {display: none !important; }

  #section .acco_wrap_mobile {max-width: 22rem; }
  #section .userBox {margin-top: 0; padding: 2rem 0;}
  #section .menu {padding-left: 2rem;}
  #section .menu li {margin-bottom: 2rem;}
  
  /* mobile menu */
  #menu-bar {display: block;}
  .change {display: block;}
  .change-bg {top: 36.5%; right: -9.2%; z-index: 2 !important;}
  /* Dashboard */
  #board_wrap {margin-left: 0;}
}

@media (max-width: 1200px) {
  /* mobile menu */
  .change-bg {top: 37%; right: -12.8%;}
}
@media (max-width: 800px) {
  /* Header */
  .head_box {padding: 0 2rem;}
  .head_box ul {margin-right:2rem;}
  /* mobile mene */
  .change-bg {top: 39.5%; right: -17%;}
  /* Dashboard */
  #board_wrap {padding: 2rem;}
  /* login */
  #section.Log {height: -webkit-fill-available; width: -webkit-fill-available;}
  #section.Log .logWrap .btn.btn_01, #section.Log .logWrap .btn.btn_07 {padding:1.5rem;}
  /* btnArea */
  .butArea {margin:2rem 0 4rem;}
  .butArea .butbox >* {margin-right:1rem;}
}

@media (max-width: 450px) {
  #top_header .head_logo {padding:1rem 2rem; width: fit-content; }
  #section .acco_wrap_mobile {max-width: 18rem;}
  #section .menu li div p {padding: 0.2rem 2rem; font-size: 1.4rem;}
  /* mobile menu */
  .change-bg {top: 37%; left: 83%;}
  /* login */
  #section.Log {background:var(--bg-white);}
  .logWrap {background:inherit; box-shadow: none; overflow: hidden; width: -webkit-fill-available; padding:4rem;}
  #top_header.log .head_box .btn.btn_01 {border-radius: 99px; padding: 1rem; font-weight: 300;}
  #top_header.log .head_box .btn.btn_01 .dp_none{display: none !important;}
  #top_header.log .head_box .btn.btn_01 .dp_block{display: block !important;}
}

@media (max-width: 375px) {
  /* 공통 css */
  .br_425 {display: block;}

  /* mobile menu */
  .change-bg {left: 80.5%;}
  /* Dashboard */
  #section .dashboard_wrap .board_flex:last-child > *:first-child .boardtext {flex-flow: column;}
  #section .dashboard_wrap .board_flex .boardbox .boardtext .free {margin-bottom:1rem;}
}
@media (max-width: 320px) {
  /* mobile menu */
  .change-bg {left: 77.5%;}
  /* login */
  .logWrap{padding:3rem;}
}