﻿@charset "utf-8";

.fixBanner{display:flex;justify-content:start;align-items:center;gap:30px;}/*배너 양측정렬 공통*/

/*new header*/
.nav_row{display:flex;align-items:center;}
#menuToggle input{display:none;}

.newHeader{position:fixed;top:0;left:0;width:100%;padding: 0 15px;background:#04246E;z-index:10;opacity:87;}
.newHeader .nav_row #menu a span{span:100%;width: 100%;}
.newHeader.bg{background:none;}
.newHeader #menu{margin-left:30px;}
.newHeader #menu a{height: 80px; padding:0px 15px; font-size:16px; color:#fff;border-color:none;display: block;}
.newHeader #menu a span{line-height: 80px;}
.newHeader #menu a:hover,
.newHeader #menu a:focus{font-weight:600;border-bottom:3px solid #fff;}
.newHeader .rmb_login_bx a{margin:0 5px;padding:13px 7px;font-size:14px;color:#fff}

/*20230720 drop menu add*/
#myDIV{display:none;}
.newHeader  a.shopping_bx {background: url('https://tourpik.b-cdn.net/images/logged_icon_blue.webp') no-repeat 90%;display: block;background-size:30px;padding-right:47px;}
.newHeader .rmb_my_bx {position:relative;}
.newHeader .rmb_my_bx .mini_menu_bx {position: absolute; padding: 8px 0; top:5px; right: 0; background: #fff; box-shadow: 1px 1px 6px rgb(0 0 0 / 30%); min-width: 235px;border-radius: 7px; z-index: 2;}
.newHeader .rmb_my_bx .mini_menu_bx:before { content: ''; position: absolute; border-bottom: 10px solid #fff; border-right: 5px solid transparent; border-left: 5px solid transparent; top: -9px; right: 21px;}
.newHeader .rmb_my_bx .mini_menu_bx > ul > li.border {border-bottom:1px dashed #dfdfdf;}
.newHeader .rmb_my_bx .mini_menu_bx > ul > li > a {padding:10px 15px; display:block; color: #333;}
.newHeader .rmb_my_bx .mini_menu_bx > ul > li > a:hover {background:#f8f8f8;}
.newHeader .rmb_my_bx .mini_menu_bx > ul > li > a.em {color:#000; font-weight:700;}
.newHeader .rmb_my_bx .mini_menu_bx > ul > li > a.red{color: #cc0000;}
.newHeader .rmb_my_bx .mini_menu_bx > ul > li > a.arch_menu {color: #39a0e2; font-weight: 500;}
/*//*20230720 drop menu add*/

/*qick*/
.qick{ position:fixed; right:25px; top:43%; width:180px;font-size:14px;z-index:5;display:none;}
.qick .exchange{background:#fff;}
.qick .exchange h4{padding:15px 10px;background:#FFD000;color:#333;font-weight:600;text-align:center;}
.qick .exchange h4 img{margin-right:5px;max-width:20px;display:inline-block;}
.qick .exchange dl{padding:15px;border:1px solid #ddd;color:#555;}
.qick .exchange dt{padding-bottom:10px;display:flex;justify-content:space-between;}
.qick .exchange dt .mony_left{padding:5px 0;font-weight:600;color:#333;}
.qick .exchange dt .mony_left span{font-size:12px;font-weight:300;color:#777;}
.qick .exchange dt .mony_right{padding:6px 8px;border:1px solid #1BC0B4;font-size:11px;border-radius:50px;color:#1BC0B4;font-weight:600;}
.qick .exchange dd{padding:5px 0;}
.qick .exchange dd span{margin-left:10px;}

/* 코멘트 신규  css */
div#boardNewCommentStyle{margin-bottom: 20px;}
div#boardNewCommentStyle *{box-sizing: border-box; font-size: 14px;}
div#boardNewCommentStyle div.countRow{margin: 20px 0 var(--comment-list-gap); padding: 10px 0; border-bottom: 1px solid #ddd;}
div#boardNewCommentStyle div.countRow span::before{
	width: var(--icon-size1); height: var(--icon-size1); display: inline-block; content: '';
	-webkit-mask: var(--iconUrl1) var(--background-pos);
	mask: var(--iconUrl1) var(--background-pos);
	-webkit-mask-size: cover; mask-size: cover;
	background-color: var(--color1); vertical-align: sub; margin-right: var(--icon-margin-right);
}
div#boardNewCommentStyle div.comment_list > ul > li:not(.comment_write, .comment_password){padding: var(--comment-list-gap) 2px; gap: 1px;}
div#boardNewCommentStyle div.comment_list > ul > li.reply:not(.comment_write, .comment_password){display: flex;}
div#boardNewCommentStyle div.comment_list > ul > li div.commentInfo{flex: 1;}
div#boardNewCommentStyle div.comment_list > ul > li div.commentInfo > div.commentWriter{font-weight: bold; margin-bottom: 4px;}
div#boardNewCommentStyle div.comment_list > ul > li div.commentInfo > div.connentContent{word-break: break-all; word-wrap: break-word;}
div#boardNewCommentStyle div.comment_list > ul > li div.commentInfo > div.connentContent + div{margin-top: 6px;}
div#boardNewCommentStyle div.comment_list > ul > li div.commentInfo > div.connentContent + div > span{display: inline-block; margin-right: 7px; color: #979797;}
div#boardNewCommentStyle div.comment_list > ul > li div.commentInfo > div.connentContent + div > a{display: inline-block; margin-right: 2px;}


div#boardNewCommentStyle .lightBlue{color: var(--color-lblue);}
div#boardNewCommentStyle .lightGreen{color: var(--color-lgreen);}
div#boardNewCommentStyle .lightRed{color: var(--color-lred);}
div#boardNewCommentStyle div.comment_list > ul > li:first-child{padding-top: 0px;}
div#boardNewCommentStyle div.comment_list > ul > li{width: 100%;}
div#boardNewCommentStyle div.comment_list > ul > li:not(.comment_write, .comment_password):not(:first-child){
	border-top: 1px solid var(--skinListBorder); border-bottom: 1px solid var(--skinListBorder);
}
div#boardNewCommentStyle div.comment_list > ul > li.comment_password + li,
div#boardNewCommentStyle div.comment_list > ul > li.comment_write + li{border-top: none !important;}
div#boardNewCommentStyle div.comment_list > ul > li.reply:not(.comment_write, .comment_password)::before{
	width: var(--icon-size2); height: var(--icon-size2); display: inline-block; content: '';
	-webkit-mask: var(--iconUrl2) var(--background-pos);
	mask: var(--iconUrl2) var(--background-pos);
	-webkit-mask-size: cover; mask-size: cover;
	background-color: var(--color2); vertical-align: sub; margin-right: var(--icon-margin-right);
}
div#boardNewCommentStyle div.comment_list > ul > li.reply{padding-left: 15px;}
div#boardNewCommentStyle div.comment_list div.next_comment_load{
	padding: 15px 0; text-align: center;
}
div#boardNewCommentStyle div.comment_list div.next_comment_load > button{padding: 12px 50px; font-size: 16px; font-weight: bold; background-color: var(--color3); border-radius: 10px; cursor: pointer;}
div#boardNewCommentStyle > div.comment_write{margin-top: 20px;}
div#boardNewCommentStyle div.comment_password,
div#boardNewCommentStyle div.comment_write{padding: 13px 12px 12px; border: 2px solid var(--color3); border-radius: 6px; box-sizing: border-box; background: var(--color4);}
div#boardNewCommentStyle div.comment_write div.user_name{margin-bottom: 10px;}
div#boardNewCommentStyle div.comment_write div.user_name::before{
	width: var(--icon-size1); height: var(--icon-size1); display: inline-block; content: '';
	-webkit-mask: var(--iconUrl3) var(--background-pos);
	mask: var(--iconUrl3) var(--background-pos);
	-webkit-mask-size: cover; mask-size: cover; background-color: var(--color1); vertical-align: sub;
}
div#boardNewCommentStyle div.comment_write div.user_name div.flex_row{float: right; gap: 10px;}
div#boardNewCommentStyle div.comment_write div.content textarea{
	overflow-x: hidden; overflow-y: auto; display: block; width: 100%;
	min-height: 15px; max-height: 400px; padding-right: 1px; border: 0; -webkit-appearance: none;
	resize: none; box-sizing: border-box; background: transparent; outline: 0;
}
div#boardNewCommentStyle div.comment_write div.content textarea::placeholder {color: var(--color2);}
div#boardNewCommentStyle div.comment_write div.content textarea:-ms-input-placeholder {color: var(--color2);}
div#boardNewCommentStyle div.comment_write div.content textarea:focus::placeholder{color: var(--color3);}
div#boardNewCommentStyle div.comment_write div.content textarea:focus::-webkit-input-placeholder{color: var(--color3);}
div#boardNewCommentStyle div.comment_write div.content textarea:focus:-ms-input-placeholder{color: var(--color3);}

div#boardNewCommentStyle div.comment_write div.manegement{display: flex; margin-top: 19px; min-height: 15px;}
div#boardNewCommentStyle div.comment_write div.manegement div.register{text-align: right; flex: 1;}
div#boardNewCommentStyle div.comment_password button.passCheck,
div#boardNewCommentStyle div.comment_write div.manegement div.register > a.btn_register{padding: 7px 12px; background-color: var(--color-lblue); color: var(--color-white); display: inline-block; border-radius: 5px; font-weight: bold; cursor: pointer;}
div#boardNewCommentStyle div.comment_write div.manegement div.comment_galley_div{flex: 1;}
div#boardNewCommentStyle div.comment_write div.manegement div.comment_galley_div + div.register{position: relative; flex: none;}
div#boardNewCommentStyle div.comment_write div.manegement div.comment_galley_div + div.register > a.btn_register{position: absolute; top: -13px; right: 0px; min-width: 55px;}

:root{
	--iconUrl1 : url(/images/icon/icon_comment.svg);
	--iconUrl2 : url(/images/icon/icon_reply.svg?v=1);
	--iconUrl3 : url(/images/icon/icom_comment_write.svg);
	--iconUrl4 : url(/images/icon/icon_photo_upload.svg);
	--comment-list-gap : 7px;
	--skinListBorder : #f2f2f2;
	--icon-size1 : 20px;
	--icon-size2 : 16px;
	--icon-margin-right : 5px;
	--color1 : #7b7b7b;
	--color2 : #aaa;
	--color3 : #ddd;
	--color-lblue : #39a0e2;
	--color-lgreen : #68c74a;
	--color-lred : #fc8f8f;
	--color-white : #fff;
	--color-red : #ff0000;
	--background-pos : no-repeat 50% 50%;
	--background-white-op5 : rgba( 255, 255, 255, 0.5 );
	--background-black-op5 : rgba( 0, 0, 0, 0.5 );
}
/* 코멘트 신규  css */

/* 리뷰쪽 신규 */	
#common_pop .btns.flex_row {gap:10px; margin-top:20px;}
#common_pop .btns.flex_row > div {flex-basis:calc((100% - 10px)/2); height:40px;}
#common_pop .btns.flex_row > div > input {width:100%; height:100%;}
#common_pop .btns.flex_row > div > span {width: 100%; height: 100%; margin: 0; display: flex; align-items: center; justify-content: center;}

#item_mid_bottom_content_review_form, #item_mid_bottom_content_qna_form{margin:0 auto; background:#39a0e2;}

div#item_mid_bottom_content_review_div select{box-sizing:border-box; border:1px solid #e0e0e0; padding:4px; width:100%; font:inherit; font-size:15px; border-radius:4px;}
div#item_mid_bottom_content_review_div textarea{box-sizing:border-box; border:1px solid #e0e0e0; padding:8px; width:100%; height:90px; font:inherit; font-size:15px; border-radius:4px;}
div#item_mid_bottom_content_review_div div.btns input[type='submit'], 
div#item_mid_bottom_content_review_div div.btns input[type='button']{background:#464646; padding:4px 16px; font-size:16px; color:white; border:none; border-radius:4px;}
div#item_mid_bottom_content_review_div dt, #item_mid_bottom_content_qna_form dt{padding: 13px; color: white; font-size: 16px;}
div#item_mid_bottom_content_review_div dt strong, #item_mid_bottom_content_qna_form dt strong{font-weight:600;}
div#item_mid_bottom_content_review_div dt img, #item_mid_bottom_content_qna_form dt img{float:right; width:16px; cursor: pointer;}
div#item_mid_bottom_content_review_div dd, #item_mid_bottom_content_qna_form dd{padding:10px; background:white;}
div#item_mid_bottom_content_review_div dd blockquote, #item_mid_bottom_content_qna_form dd blockquote{border:1px solid #e6e6e6; border-width:1px 0; display:table; width:100%; background:#f6f6f6; margin:0 0 14px 0;}
div#item_mid_bottom_content_review_div dd blockquote div, #item_mid_bottom_content_qna_form blockquote div{display:table-cell; vertical-align:middle; padding:13px 0;}
div#item_mid_bottom_content_review_div dd blockquote div:first-child, #item_mid_bottom_content_qna_form blockquote div:first-child{width:94px; text-align:center;}
div#item_mid_bottom_content_review_div dd blockquote div:last-child, #item_mid_bottom_content_qna_form blockquote div:last-child{font-size:15px; color:#747474; line-height:1.8em;}
div#item_mid_bottom_content_review_div dd blockquote div:last-child b, #item_mid_bottom_content_qna_form blockquote div:last-child b{font-size:16px; color:black; font-weight:600;}
div#item_mid_bottom_content_review_div dd > ul{border:1px solid #dfdfdf; margin:0 0 16px 0; padding:0; list-style:none; overflow-y: auto; max-height: 600px;}

div#item_mid_bottom_content_review_div dl dd > ul li{display:list-item !important;}
div#item_mid_bottom_content_review_div dd > ul > li:nth-of-type(1){padding:9px 5px; font-size:16px;}
div#item_mid_bottom_content_review_div dd > ul > li:nth-of-type(1) b{display:inline-block; width:75px; text-align:center;}
div#item_mid_bottom_content_review_div dd > ul > li:nth-of-type(1) input[type='text']{border:1px solid #d6d6d6; border-radius:0;}
div#item_mid_bottom_content_review_div dd > ul > li:nth-of-type(1) input[type='text'] + span{line-height: 28px;}
div#item_mid_bottom_content_review_div dd > ul > li:nth-of-type(2){padding:5px; border:1px solid #efefef; border-width:1px 0;}
div#item_mid_bottom_content_review_div dd > ul > li:nth-of-type(2) table{width:100%;}
div#item_mid_bottom_content_review_div dd > ul > li:nth-of-type(2) table th{border-top:1px solid white; text-align:center !important; background:#f6f6f6; padding:18px 0; font-weight:normal; font-size:15px; color:#363636;}
div#item_mid_bottom_content_review_div dd > ul > li:nth-of-type(2) table td{border-top:1px solid white; text-align:center;}
div#item_mid_bottom_content_review_div dd > ul > li:nth-of-type(3){padding:8px;}
div#item_mid_bottom_content_review_div dd > ul > li:nth-of-type(3) textarea{
	border-radius:0; border:1px solid #e0e0e0; overflow-x: hidden; overflow-y: auto;
	-webkit-appearance: none; resize: none; box-sizing: border-box; background: transparent; outline: 0;
}
div#item_mid_bottom_content_review_div form textarea::placeholder {color: var(--color2);}
div#item_mid_bottom_content_review_div form textarea:-ms-input-placeholder {color: var(--color2);}
div#item_mid_bottom_content_review_div form textarea:focus::placeholder{color: var(--color3);}
div#item_mid_bottom_content_review_div form textarea:focus::-webkit-input-placeholder{color: var(--color3);}
div#item_mid_bottom_content_review_div form textarea:focus:-ms-input-placeholder{color: var(--color3);}

#item_mid_bottom_content_review_form dd ul + p{text-align:center;}
#item_mid_bottom_content_review_form dd ul + p input{width:100px; height:40px; font:inherit; font-size:16px !important; border-radius:0 !important; background:#383838 !important;}
#item_mid_bottom_content_qna_form dd ul {border:1px solid #dfdfdf; margin:0; padding:0; list-style:none;}
#item_mid_bottom_content_qna_form dd ul li{display:table; width:100%; table-layout:fixed; margin:0; padding:0; border-top:1px solid #efefef;}
#item_mid_bottom_content_qna_form dd ul li:first-child{border-top:none;}
#item_mid_bottom_content_qna_form dd ul li > b{display:table-cell; vertical-align:top; width:80px; text-align:left; font-weight:600; font-size:15px; padding:8px;}
#item_mid_bottom_content_qna_form dd ul li > span{display:table-cell; vertical-align:middle; padding:8px; font-size:15px;}
#item_mid_bottom_content_qna_form dd ul li > span img{height:42px; vertical-align:middle;}
#item_mid_bottom_content_qna_form dd ul li > span em{font-weight:600; font-style:normal; font-size:15px; color:black;}
/* 리뷰쪽 신규 */


/* QR */
#qr_bx {
    background: linear-gradient(180deg, #fca46c, #ffdc4c, #b7da8f,#4dc6f3);
    margin: 0 auto;
	min-height: 100%;
}

#qr_bx .qr_bx_in {
    padding: 20px 15px;
    position: relative;
}

#qr_bx .qr_bx_in .qr_top {
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

#qr_bx .qr_bx_in .qr_top .title h3 {
    font-size: 30px;
    color: #fff;
}

#qr_bx .qr_bx_in .qr_mid {
    background: #fff;
    border-radius: 10px;
    padding: 40px;
    margin-bottom: 4px;
    position: relative;
}

#qr_bx .qr_bx_in .qr_mid:after {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -8px;
    border: 7px dashed #fff;
    display: block;
    content: "";
    width: calc(100% - 27px);
}

#qr_bx .qr_bx_in .qr_mid > ul {
    gap: 10px;
}

#qr_bx .qr_bx_in .qr_mid > ul > li > div.title > p {
    color: #00adef;
    font-size: 23px;
    font-weight: 500;
}

#qr_bx .qr_bx_in .qr_mid > ul > li > div.info > p {
    color: #333;
    font-size: 23px;
}

#qr_bx .qr_bx_in .qr_mid > ul > li.flex_row {
    align-items: center;
}

#qr_bx .qr_bx_in .qr_mid > ul > li.flex_row > div.title {
    flex-basis: 100px;
}

#qr_bx .qr_bx_in .qr_mid > ul > li.flex_row > div.info {
    flex-basis: calc(100% - 100px);
}

#qr_bx .qr_bx_in .qr_bot {
    background: #fff;
    border-radius: 10px;
    padding: 70px 40px 40px;
}

#qr_bx .qr_bx_in .qr_bot .quantity {
    gap: 10px;
    margin-bottom: 20px;
}

#qr_bx .qr_bx_in .qr_bot .quantity .info > ul {
    justify-content: center;
    align-items: center;
    gap: 6px;
}

#qr_bx .qr_bx_in .qr_bot .quantity .title {
    text-align: center;
}

#qr_bx .qr_bx_in .qr_bot .quantity .title > p {
    color: #00adef;
    font-size: 23px;
    font-weight: 500;
}

#qr_bx .qr_bx_in .qr_bot .quantity .info p {
    color: #333;
    font-size: 23px;
}

#qr_bx .qr_bx_in .qr_bot div.swiper-slide > div.codeQrDiv.USED,
#qr_bx .qr_bx_in .qr_bot div.swiper-slide > div.codeQrDiv.ETC,
#qr_bx .qr_bx_in .qr_bot div.swiper-slide > p.USED,
#qr_bx .qr_bx_in .qr_bot div.swiper-slide > p.ETC{position: relative;}
#qr_bx .qr_bx_in .qr_bot div.swiper-slide > div.codeQrDiv.USED::after,
#qr_bx .qr_bx_in .qr_bot div.swiper-slide > div.codeQrDiv.ETC::after,
#qr_bx .qr_bx_in .qr_bot div.swiper-slide > p.USED::after,
#qr_bx .qr_bx_in .qr_bot div.swiper-slide > p.ETC::after{
	content: attr(date-text);
	position: absolute;
	font-size: 25pt;
	letter-spacing: 25px; color: #ff7878;
	top: 50%; text-shadow: 4px 2px 2px gray; font-weight: bold;
	left: 50%; transform: translateX(-50%) translateY(-50%) rotate(45deg);
}

#qr_bx .qr_bx_in .down_btn {
    position: absolute;
    right: 70px;
    bottom: 60px;
}

.state {
    margin-top: 15px;
    text-align: center;
}

.state p:first-child {
    color: #fb7c2e;
    font-weight: 700;
    font-size: 23px;
    margin-bottom: 5px;
}

.state p:last-child {
    font-size: 16px;
    color: #333;
    font-weight: 600;
}
/* QR */



@media (max-width:1023px){
	
	.fixBanner{display:block;}	
	.qick{display:none;}

	.newHeader{padding:14px 15px;opacity:.95;}
	.newHeader .logo a img{width:74px;vertical-align: middle;}
	.newHeader .rmb_login_bx{margin-right:50px;}
	.newHeader #menu{margin-left:0;}
	.newHeader #menu a{font-size:160%;border:0 none;padding:0px;}
	.newHeader #menu a:hover,
	.newHeader #menu a:focus{font-size:160%;}

	#menu:not(.tab_content){position:fixed; width:100%; margin:0; padding:50px; padding-top:125px; background:#39a0e2; list-style-type:none; -webkit-font-smoothing:antialiased; transform-origin:0% 0%; transform:translate(100%, 0); transition:transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0); top:0; left:0; height:100%; }
	#menu ul{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);}
	#menu ul.nav_row{display:block}
	#menu li{text-align:center;display:block;}
 
	#menuToggle{position:fixed; top:24px; right:20px; z-index:3; -webkit-user-select:none; user-select:none; }
	#menuToggle a{display:block; text-decoration:none; transition:color 0.3s ease; }
	#menuToggle a:hover,
	#menuToggle a:focus{font-weight:700;}
	#menuToggle input{display:block; width:40px; height:35px; position:absolute; top:-8px; left:-5px; cursor:pointer; opacity:0; z-index:2; -webkit-touch-callout:none; }
	#menuToggle > span
	{
	  display:block;
	  width:32px;
	  height:4px;
	  margin-bottom:5px;
	  position:relative;
	  background:#cdcdcd;
	  border-radius:3px;
	  z-index:1;
	  transform-origin:8px 5px;
	  transition:transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
				  background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
				  opacity 0.55s ease;
	}

	#menuToggle > span:first-child{transform-origin:0% 100%; }
	#menuToggle > span:nth-last-child(2){transform-origin:0% -100%; }
	#menuToggle input:checked ~ span{opacity:1; transform:rotate(45deg) translate(-2px, -1px); background:#fff; }
	#menuToggle input:checked ~ span:nth-last-child(3){opacity:0; transform:rotate(0deg) scale(0.2, 0.2); }
	#menuToggle input:checked ~ span:nth-last-child(2){transform:rotate(-45deg) translate(0, -1px); }
	#menuToggle input:checked ~ div{transform:none; }
}
	
@media (max-width:680px){
	.newHeader .rmb_my_bx .mini_menu_bx{min-width: 180px;}	
	.newHeader .rmb_my_bx .mini_menu_bx ul li{display: block;}
	/*20230720 drop menu add*/
	.newHeader .rmb_login_bx a{margin:0;}
	.newHeader  a.shopping_bx{background:none;padding-right:5px;}
	/*//*20230720 drop menu add*/
	
	.product_inTab{position:relative;left:0;top:auto;height:40px;}
	
	#item_list .list_in > ul > li > a .info .price span{margin-top:3px;display:block;}

	div#item_mid_bottom_content_review_div dd ul{max-height: auto;}

	div#boardNewCommentStyle div.comment_write div.user_name > input{width: calc(50% - 15px);}
	div#boardNewCommentStyle div.comment_write div.user_name div.flex_row{margin: 10px 0; width: 100%;}
	div#boardNewCommentStyle div.comment_write div.user_name div.flex_row .left{flex: 1;}
	div#boardNewCommentStyle div.comment_write div.user_name div.flex_row .left input{width: 100%;}
	div#boardNewCommentStyle div.comment_write div.user_name div.flex_row .right{width: 125px;}
}

@media (max-width:480px){
	.newHeader #menu a{padding:0}
	.newHeader .rmb_login_bx{margin-right:40px}
}


/* 클릭 영역 */
.container-disable { 
	/* 클릭 불가능 none */
	pointer-events : none;
}

/* 공통 모달창 */
#modal_bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 98;
    display: none;
}

.modal {
    /* Your existing styles */
    overflow-y: auto;
    max-height: calc(100vh - 40px); /* Adjust as needed */
}

body.modal-open {
    overflow: hidden;
}

div#item_mid_bottom_content_review_div.newReviewWrite.mobile{
	width: 100%; max-width: 100%;
}

div#item_mid_bottom_content_review_div.newReviewWrite:not(.mobile){
    position: fixed;
    width: 95%;
    max-width: 700px;
    left: 50%; top: 50%;
    transform: translate(-50%, -50%);
    background:#fff;
    z-index:10;
    box-shadow:0px 0px 7px rgba(0,0,0,0.4);
    border:1px solid #ccc; height: 100%; max-height: calc(100% - 170px);
	border-radius: 0px;
}

@media (max-width:680px){
    div#item_mid_bottom_content_review_div.newReviewWrite:not(.mobile){
        left: 0px; top: 0px; right: 0px; bottom: 0px;
        transform: translate(0%, 0%); width: 100%; height: 100%; max-height: 100%; max-width: 100%;
    }
}