@charset "utf-8";
/* @container (min-width: 1920px) { } */
/*aspect-ratio: 16 / 9.3; */
/*border:1px solid red;*/


	.page_top {
		border-bottom:1px solid #eaeaea; 
	}

	.page_center {
		display:flex;
		flex-direction: column; 
		.search_box {
			position:relative;
			display:block;
			margin:min(50px, 6.57vw) min(30px, 4vw);
			height:50px;line-height:50px;
			border:2px solid #cccccc;
			border-radius:999px;
			background-color:#ffffff;
			text-align:center;
			input[name='searchKeyword'] {
				/*border:1px solid red; */
				text-align:left;
				font-size:16px;
				padding:min(10px, 1.3vw) min(20px, 2.6vw);
				width:calc(100% - 80px);
				margin-right:min(40px, 5.26vw);
			}
			.search_icon {
				position:absolute;
				top:50%;
				transform:translateY(-50%);
				right:min(30px, 4vw);
				margin-left:10px;
				margin-right:4px;
				width:26px; height:auto;
			}
		}

		.search_list { 
		/*border:1px solid green;*/
			position:relative;
			background-color:#ffffff;
			width:calc(100% - min(30px, 4vw));
			margin:0;
			padding:min(50px, 6.57vw) 0 min(30px, 4vw) min(30px, 4vw);
			overflow:hidden;
			.search_slide { 
				display:inline-block;
				width:100%;
				white-space: nowrap;
				transition: transform 1s ease;
				overflow:auto;
				border-bottom:1px solid #eeeeee;/**/
				/*border:1px solid green;*/
				/*overflow-y:hidden;*/	
				-ms-overflow-style: none;	/* 인터넷 익스플로러, 엣지 */				
				scrollbar-width: none;/* 3. Firefox용 */			
				-webkit-overflow-scrolling: touch;/* iOS에서 부드러운 관성 스크롤 적용 */
				scroll-snap-type: x mandatory;
				&::-webkit-scrollbar {
					display: none; /* 크롬, 사파리, 오페라, 엣지(신버전) */
				}
				.search_item {
					display:inline-block;
					vertical-align:top;
					overflow:hidden;
					width:auto;
					max-width:min(82vw, 500px);
					margin:0 min(30px, 4vw) 0 0;
					padding:0 0 min(15px, 2vw) 0;
					text-align:left;				
					font-size:1.32rem;
					font-weight:500;
					&.on {
						font-weight:700;
						color:#2794bb;
						border-bottom:2px solid #2794bb;
					}
				}
			}
		}

		.say_box {
			flex:1;
			overflow:auto;
			overflow-x:hidden;
			transition: all 0.5s ease-in-out;
			 -ms-overflow-style: none;	/* 인터넷 익스플로러, 엣지 */				
			scrollbar-width: none;/* 3. Firefox용 */
			/* iOS에서 부드러운 관성 스크롤 적용 */
			-webkit-overflow-scrolling: touch;
			scroll-snap-type: x mandatory;

			&::-webkit-scrollbar {
				display: none; /* 크롬, 사파리, 오페라, 엣지(신버전) */
			}
			margin:min(30px, 4vw);
			text-align:left;
			/*border:1px solid green;*/
			.say_list {
				border-bottom:1px solid #eeeeee;
				padding-bottom:min(30px, 3.9vw);
				margin-bottom:min(30px, 3.9vw);
				line-height:2em;
				.book_mark {
					float:right;
					width:min(35px, 4.6vw); height:auto;
					margin-top:min(20px, 2.6vw);
					margin-right:min(10px, 1.3vw);
				}
				.say_en {
					font-weight: 500;						
				}
				.say_kr {
					font-size:1.12rem;
					font-weight:700px;
				}
				.say_rm {

				}
				.say_speaker {
					float:right;
					color: #2794bb;
					font-weight: 500;
					img { 
						width:min(35px, 4.6vw); height:auto;
						margin-right:min(10px, 1.3vw);
					}
				}
			}
		}

		.say_page {
			display: flex;
			justify-content: space-between;
			align-items: center; /* 수직(교차축) 중앙 정렬 */
			height:min(150px, 19.73vw);
			line-height:min(150px, 19.73vw);
			margin:0 0 min(20px, 2.6vw) 0;
			padding:min(30px, 4vw);
			/*border:1px solid red;*/
			/*box-shadow: 0 10px 10px -5px rgba(0, 0, 0, 0.3);*/
			.arr {
				width:16px; height:auto;
			}
			.num {
				display:inline-block;
				text-align:center;
				width:35px; height:35px; line-height:35px;
				/*border:1px solid red;*/
				border-radius:50px;
				font-size:16px; /*1.28rem;*/
				font-weight:500;

				&.none {
					img { width:90% }
				}
				&.on { 
					background-color:#2793ba;
					color:#ffffff;

				}
			}
		}
		.say_pop {
			position:absolute;
			display:none;
			top:min(152px, 20vw);/*top:min(76px, 10vw);*/
			left:min(50px, 6.57vw); 
			padding:min(40px, 5.2vw);
			width:min(580px, 76.31vw);
			height:min(800px, 105.26vw);
			background-color:#ffffff;
			border:1px solid #cccccc;
			border-radius:min(30px, 3.9vw);
			box-shadow: -5px -5px 10px rgba(0, 0, 0, 0.2),  5px 5px 10px rgba(0, 0, 0, 0.2);

			.say_close {
				text-align:right;
				.xx {
					cursor:pointer;
					width:min(40px, 5.2vw); height:auto;
				}
			}
			.say_box {
				padding-bottom:min(50px, 6.57vw);
				&:not(:last-child) {
					border-bottom:1px solid #2794bb;
				}
				.say_speaker {
					float:right;
					color:#2794bb;
					font-weight:500;
					img {
						width:min(50px, 6.57vw); height:auto;
						margin-right:min(10px, 1.3vw);
					}
				}
				.say_title {
					color:#2794bb;
					font-size:1.12rem;
					font-weight:700;
					height:2em;
					line-height:2em;
				}
				.say_text {
					padding-top:min(10px, 1.3vw);
					font-weight:500;
					height:auto;
					line-height:1.4em;
				}
			}
		}
	}
	.page_bottom {
		box-shadow: 0 -5px 10px rgba(0, 0, 0, 0.2);
	}