/* @font-face {
            font-family: "NotoSansKR";
            src: url("https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;700&display=swap");
            font-style: normal;
            unicode-range: U+0041-005A, U+0061-007A;
        }

        html, body{
            font-family: NotoSansKR,Poppins, Helvetica, "sans-serif" !important;
        } */
		@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
		@font-face {
		font-family: 'twayair';
		src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_tway@1.0/twayair.woff') format('woff');
		font-weight: normal;
		font-style: normal;
		}
		* { 
		font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif !important;
		letter-spacing: 0px;
		margin: 0;
		padding: 0;
		list-style: none;
		}
		

		a:hover,button:hover {color: #878787;}

		/* header 공통 style */
		.w-29px{
			width: 29px;
		}
		
		.position-absolut-left-top{
			position: absolute;
			left: 1.5rem;
			top: 1.7rem;
		}
		.w-170{
			width: 168px;
			height: 27px;
		}
		.bg{background-color: #fff !important;
			height: 60px !important; 
			padding: 14px 20px !important;
			border-bottom: 1px solid #F2F2F2;
		}

		.justify-content-space-between{
			justify-content: space-between;
		}
		.logo-wrap{
			width: 100%;
			height: 60px;
		}
		.logo{
			width: 259px;
		}
		.mr-10px{margin-right: 10px;}
	
		.header-icon{
			width: 100%;
			height: 60px;
			position: relative;
			background-color: #fff;
			/* display: flex;
			justify-content: space-between;
			align-items: center; */
		}
		.hamburger-absol{
			position: absolute;
			top: 30px;
			left: 36px;
			transform: translate(-50%, -50%);
		}
	
		.logo-absol{
			position: absolute;
			top: 29px;
			left: 50%;
			transform: translate(-50%, -50%);
		}
		.write-absol{
			position: absolute;
			top: 30px;
			right: 5px;
			transform: translate(-50%, -50%);
		}

		/* 백버튼 */
		.w-29px{
			width: 29px;
		}
		
		.link-icon{
			width: 32px;
			height: 32px;
			position: relative;
		}

		/* 명칭  헤더*/
		.header-guestbook-logo{
			font-size: 22px;
			letter-spacing: 0px;
			color: #212121;
			margin-bottom: 0px !important;
			font-weight: 600;
		}

		/* floating_over */
		#floating_over{
			bottom: 55px;
			z-index: 1 !important;
		}
		/* 글쓰기 모달 */
		.layout_wrap{
			position: relative;
			}
	
		.modal-bg{
			width: 100%;
			height: 100vh;
			position: absolute;
			left: 0;
			right: 0;
			bottom: 0;
			top: 0;
			background-color: #0D0D0D85;
			z-index: 10000000;
		}
		.modal-box{
			position: absolute;
			width: 222px;
			background-color: #fff;
			box-shadow: 0px 3px 6px #00000029;
			border-radius: 5px;
			margin: 0 auto;
			top: 30%;
			left: 50%;
			transform: translate(-50%, -50%);
		}
		.modal-title{
			width: 198px;
			height: 40px;
			border-radius: 5px;
			background-color: #00B877;
			letter-spacing: 0px;
			color: #FFFFFF;
			font-size: 20px;
			margin: 12px auto 0px auto;
			text-align: center;
			line-height: 40px;
			font-weight: 300;
		}
		.modal-list{
			width: 70%;
			margin: 0 auto;
			letter-spacing: 0px;
			color: #414141;
			text-align: center;
			padding: 14.7px 0;
			border-bottom: 1px solid #F2F2F2;
			font-size: 20px;
			letter-spacing: 0px;
			font-weight: 600;

		}
		.modal-bg > div > div > li:last-child{
			/* 모달리스트 마지막(취소) */
			border: none;
			font-size: 20px;
			letter-spacing: 0px;
			font-weight: 400;
			color: #FF5151;
		}
		#modal > div > ul > li:last-child{
			color: #FF5151;
		}

		/* 바디 스크롤 막기 */
		.not-scroll{
			position: fixed;
			overflow: hidden;
			width: 100%;
			height: 100%
		}
		.not-scroll .cont {
			position: relative;
			top: 0;
		}

		button:focus,
		button:active {
			outline: none !important;
			box-shadow: none !important;
		}

		@media only screen and (max-width: 500px){
			.logo {
				width: 178px;
				height: 28px;
			}
		}

		