@charset "utf-8";
/*-------------------------------------------------------*/
/* textbook page
/*-------------------------------------------------------*/
.page_wrap--textbook .container{
	padding: 30px;
}
.page_wrap--textbook .container + .container{
	margin-top: 25px;
}
.page_wrap--textbook .container .tb_head_notice{

}
.page_wrap--textbook .container > .ttl{
	margin-bottom: 15px;
}
.page_wrap--textbook .container.container_level_check .tb_recommend_links{
	position: absolute;
	top: 15px;
	right: 30px;
}
/* page_wrap--textbook_chapter */
.page_wrap--textbook_chapter .container{
	padding: 0;
	background: transparent;
	box-shadow: none;
	margin: 0 auto 10px;
}
.page_wrap--textbook_chapter .container .page_breadcrumbs_2{
	margin: 0;
	border: none;
	padding: 0;
	min-height: 37px;
	display: flex;
	align-items: center;
}
.page_wrap--textbook_chapter .container .page_breadcrumbs_2 > ul{
	display: flex;
	align-items: center;
}
.page_wrap--textbook_chapter .container .page_breadcrumbs_2 > ul > li:after{
	margin: 0 8px 0 4px;
}
.page_wrap--textbook_chapter .container .page_breadcrumbs_2 .page_ttl{
	font-size: 1.4rem;
}

/*-------------------------------------------------------*/
/* textbook sale page
/*-------------------------------------------------------*/
.page_wrap--textbook_sale .container .content{
    line-height: 1.5;
    width: 900px;
    margin: 0 auto;
    font-size: 15px;
    font-size: 1.5rem;
    	/*padding:30px;*/
}
.page_wrap--textbook_sale .container h3{
	padding:10px 0 15px;
	border-bottom:#eee solid 1px;
	margin-bottom: 15px;
}
.page_wrap--textbook_sale .container .content_ttl{
	line-height:26px;
	padding-left:10px;
	font-size:14px;
	font-size:1.4rem;
	margin-bottom: 20px;
}
.page_wrap--textbook_sale .container .content_ttl.b_l_gray{
	border-left:solid 8px #EDEDED;

}
.page_wrap--textbook_sale .container .content_ttl strong {
	font-weight:bold;
	padding-right:20px;
}
.page_wrap--textbook_sale .textbook_sale_list_wrap{
	border-bottom: #ccc 1px dotted;
}
.page_wrap--textbook_sale .textbook_sale_list{
	padding-bottom:20px;
	font-size: 0px;
}
.page_wrap--textbook_sale .textbook_sale_item:nth-child(3n){
	margin-right: 0px;
}
.page_wrap--textbook_sale .textbook_sale_area .textbook_sale_list_wrap .textbook_sale_list + p{
	font-weight: bold;
	background: #fff8f9;
	border-radius: 5px;
	border: solid 2px #ffd6d6;
	padding: 20px;
	text-align: center;
	margin-bottom: 30px;
	font-size: 17px;
	font-size: 1.7rem;
	color: #f00;
}


.page_wrap--textbook_sale .textbook_sale_item{
	display: inline-block;
	width: 280px;
	box-sizing:border-box;
	vertical-align: top;
	margin: 0 30px 30px 0;
	font-size: 15px;
}
.page_wrap--textbook_sale .textbook_sale_item h4{
	color:#fff;
	text-align:center;
	line-height: 1.5;
	padding: 7px 0 5px;
	margin-bottom: 16px;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_0{
	background-color:#C5D222;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_1{
	background-color:#DC1501;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_2{
	background-color:#FCC427;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_3{
	background-color:#0272BA;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_4{
	background-color:#38982A;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_5{
	background-color:#ED801C;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_6{
	background-color:#7D428E;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_phonics1{
	background-color:#4C9EFF;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_phonics2{
	background-color:#82C209;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_phonics3{
	background-color:#F08003;
}

/*igarasi*/
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_side_by_side_1{
	background-color:#05318e;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_side_by_side_2{
	background-color:#b80404;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_side_by_side_3{
	background-color:#015d14;
}
.page_wrap--textbook_sale .textbook_sale_item h4.lesson_book_side_by_side_4{
	background-color:#f75501;
}

.page_wrap--textbook_sale .textbook_sale_item dl{
	display: table;
	width: 100%;
	margin-bottom: 15px;
}
.page_wrap--textbook_sale .textbook_sale_item dt,
.page_wrap--textbook_sale .textbook_sale_item dd{
	display: table-cell;
	width: 50%;
	vertical-align: top;
}
.page_wrap--textbook_sale .textbook_sale_item dt img{
	height: auto;
}
.page_wrap--textbook_sale .textbook_sale_item dd{
	position: relative;
	padding:0px 0 10px 10px;
	line-height:1.2;
}
.page_wrap--textbook_sale .textbook_sale_item dd p{
	line-height: 1.5;
}
.page_wrap--textbook_sale .textbook_sale_item dd p.price{
	position: absolute;
	bottom: 0;
	left: 10px;
}
.page_wrap--textbook_sale .textbook_sale_item .item_bottom{
	text-align: center;
	border: solid 3px #EDEDED;
}
.page_wrap--textbook_sale .textbook_sale_item .item_bottom a{
	display: block;
	padding: 15px;
	font-size: 15px;
	font-size: 1.5rem;
	cursor: pointer;
	color:#000;
}
.page_wrap--textbook_sale .textbook_sale_item .item_bottom a:hover{
	opacity:0.6;
}
.page_wrap--textbook_sale .textbook_sale_item .item_bottom .alt_txt{
	padding: 15px;
	font-size: 15px;
	font-size: 1.5rem;
	color: #ccc;
}
.page_wrap--textbook_sale .textbook_sale_item .item_bottom input[type='checkbox']{
	margin-right: 5px;
}
.page_wrap--textbook_sale .textbook_sale_caution{
	padding:15px;
	background:#eee;
}
.page_wrap--textbook_sale .textbook_sale_caution h4{
	text-align:center;
	border-bottom:solid 1px #EDEDED;
	font-size:16px;
	font-size:1.6rem;
	font-weight:bold;
	padding-bottom:10px;
	color:#999999;
}
.page_wrap--textbook_sale .textbook_sale_caution ul{
	padding:10px 10px;
}
.page_wrap--textbook_sale .textbook_sale_caution ul li + li{
	margin-top:10px;
}
/* textbook_sale_publisher */
.textbook_sale_publisher p.ttl{
	font-weight:bold;
	/*margin-top:20px;*/
}

.textbook_sale_publisher li{
	display:inline-block;
	margin-right:5px;
}
/* textbook_sale_regist */
.textbook_sale_regist{
	margin-top:10px;
	padding-bottom:40px;
	border-bottom:dotted 1px #ccc;
}
.textbook_sale_regist dl{
	display:table;
	width:752px;
	margin:0 auto;
	line-height:1.5;
	border-bottom:solid 1px #ccc;
	padding:15px 0;
}
.textbook_sale_regist dl dt{
	display:table-cell;
	width:180px;
	vertical-align:middle;
	font-weight:bold;
}
.textbook_sale_regist dl dd:nth-child(2){
	display:table-cell;
	vertical-align:middle;
	width:42px;
	padding-left:10px;
}
.textbook_sale_regist dl dd:nth-child(3){
	display:table-cell;
	vertical-align:middle;
	padding-left:20px;
	width: 495px;
}
.textbook_sale_regist dl dd:nth-child(3) input[type="text"],
.textbook_sale_regist dl dd:nth-child(3) input[type="tel"],
.textbook_sale_regist dl dd:nth-child(3) input[type="email"]{
	width:100%;
	box-sizing: border-box;
	background:#fff;
	font-family: inherit;
}

.textbook_sale_regist dl dd span{
	width:42px;
	height:22px;
	line-height:22px;
	text-align:center;
	color:#fff;
	background:#F05444;
	border-radius:5px;
	font-size:12px;
	font-size:1.2rem;
	display:inline-block;
}
.textbook_sale_regist table th span{
	font-size:12px;
}
.textbook_sale_regist table td{
	width:70%;
}
.textbook_sale_regist table td input{
	width:100%;
}
.textbook_sale_area .t_red{
	color: #f00;
}

/* textbook_sale_regist_conf */
.textbook_sale_regist_conf{
	margin-top:40px;
	padding-bottom:20px;
}
.textbook_sale_regist_conf table{
	width:100%;
	max-width:600px;
	margin:0 auto;
	border-collapse: separate;
	border-spacing: 20px;
}
.textbook_sale_regist_conf table tr{
	margin-bottom:10px;
}
.textbook_sale_regist_conf table th{
	text-align:left;
	width: 30%;
}
.textbook_sale_regist_conf table td{
	width:70%;
}
.textbook_sale_regist_conf table td input{
	width:100%;
}

/*-------------------------------------------------------*/
/* new textbook page component
/*-------------------------------------------------------*/
.tb_wrap{
	position: relative;
	margin-top: 30px;
}
/*---------------------------------------------------*/
/* NC-5433 textbook filter feature
/*---------------------------------------------------*/
.tb_wrap .tb_top_wrap {
	padding: 30px 30px 0;
}
.tb_wrap .tb_top_wrap .sec_1 {
	position: relative;
}
.tb_wrap .tb_top_wrap .sec_1 .ttl {
	font-size: 18px;
	font-weight: bold;
	line-height: 1.4;
	margin-bottom: 25px;
}
.tb_wrap .tb_top_wrap .sec_1 .text {
	font-size: 16px;
	line-height: 1.6;
}
.tb_wrap .tb_top_wrap .sec_1 .diagnosis_wrap {
	position: absolute;
	right: 0;
	bottom: 4px;
}
.tb_wrap .tb_top_wrap .sec_1 .diagnosis_wrap .btn_style.btn_tb_recommend {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 5px 10px;
	position: relative;
	min-width: 250px;
	height: auto;
	line-height: 1;
}
.tb_wrap .tb_top_wrap .sec_1 .diagnosis_wrap .btn_style.btn_tb_recommend img {
	display: block;
	width: 22px;
	height: 26px;
	transition: none;
	margin-left: 5px;
}
.tb_wrap .tb_top_wrap .sec_1 .diagnosis_wrap .btn_style.btn_tb_recommend:hover img {
	opacity: 1;
}
.tb_wrap .tb_top_wrap .sec_1 .diagnosis_wrap .tooltip.tooltip--tb_diagnosis{
	position: absolute;
	z-index: 200;
	top: -18px;
	left: -314px;
	margin: auto;
	width: 270px;
	padding: 10px 15px;
	background-color: #fff;
	border: #ccc 1px solid;
	border-radius: 10px;
	box-shadow: 0 0 3px 0 rgba(0,0,0,0.2);
	line-height: 1.5;
	font-size: 15px;
}
.tb_wrap .tb_top_wrap .sec_1 .diagnosis_wrap .tooltip.tooltip--tb_diagnosis:before {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: '';
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(204, 204, 204, 0);
	border-left-color: #ccc;
	border-width: 9px;
	margin-top: -9px;
}
.tb_wrap .tb_top_wrap .sec_1 .diagnosis_wrap .tooltip.tooltip--tb_diagnosis:after {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: '';
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(255, 255, 255, 0);
	border-left-color: #fff;
	border-width: 8px;
	margin-top: -8px;
}
.tb_wrap .tb_top_wrap .tab_nav_wrap {
	padding: 40px 0 30px;
}
.tb_wrap .tab_nav_list {
	display: flex;
	justify-content: center;
}
.tb_wrap .tab_nav_list .list_item {
	text-align: center;
	border: 2px solid #092846;
	overflow: hidden;
	background-color: #092846;
}
.tb_wrap .tab_nav_list .list_item:not(:first-child) {
	border-left: none;
}
.tb_wrap .tab_nav_list .list_item:first-child {
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}
.tb_wrap .tab_nav_list .list_item:last-child {
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}
.tb_wrap .tab_nav_list .list_item .tab_nav_btn {
	display: flex;
	width: 296px;
	height: 42px;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	font-size: 16px;
	font-weight: bold;
	color: #092846;
}
.tb_wrap .tab_nav_list .list_item .tab_nav_btn.on {
	background-color: #092846;
	color: #fff;
}
.tb_wrap .filter_area {
	/*overflow: hidden;*/
	padding-bottom: 40px;
}
.tb_wrap .filter_area .flex {
	display: flex;
	align-items: center;
	justify-content: center;
}
.tb_wrap .filter_area .filter_ttl {
	color: #555;
	font-weight: bold;
	font-size: 18px;
}
.tb_wrap .filter_wrap {
	padding: 20px 20px 25px 20px;
	width: 450px;
	margin: 0 30px;
}
.tb_wrap .filter_wrap .level_filter {
	position: relative;
}
.tb_wrap .filter_wrap .ui-slider-horizontal {
	height: 6px;
}
.tb_wrap .filter_wrap .filter_handle {
	width: 20px;
	height: 20px;
	background-color: #ffffff;
	background-image: none;
	border-radius: 50%;
	border: 3px solid #f1890e;
	top: 50%;
	transform: translateY(-50%);
	z-index: 101;
	margin-left: -13px;
}
.tb_wrap .filter_wrap  .ui-widget-header {
	background: none;
	background-color: transparent;
	margin: 0;
}
.tb_wrap .filter_wrap .ui-widget-content {
	border-radius: 4px;
	border: none;
	background: none;
	background-color: #d3d3d3;
}
.tb_wrap .filter_wrap .filter_color_bar {
	width: 100%;
	height: 6px;
	display: flex;
	flex-wrap: nowrap;
	background-color: transparent;
	position: absolute;
	top: 0;
	left: 0;
}
.tb_wrap .filter_wrap .filter_color_bar .single_color_bar {
	display: block;
	height: 100%;
	width: 11.11%;
	background-color: transparent;
}
.tb_wrap .filter_wrap .filter_color_bar .single_color_bar:last-child {
	width: 11.2%;
}
.tb_wrap .filter_wrap .filter_color_bar .single_color_bar.on {
	background-color: #f1890e;
}
.tb_wrap .filter_wrap .filter_scale {
	width: 100%;
	height: 6px;
	background-color: transparent;
	position: relative;
}
.tb_wrap .filter_wrap .filter_scale .single_scale {
	position: absolute;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background-color: #d3d3d3;
	border: none;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 100;
}
.tb_wrap .filter_wrap .filter_scale .single_scale.on {
	background-color: #f1890e;
}
.tb_wrap .filter_wrap .filter_scale .single_scale:after{
	content: 'lv';
	display: block;
	position: absolute;
	top: 100%;
	left: 50%;
	width: 100px;
	text-align: center;
	transform: translateX(-50%);
	margin-top: 10px;
	font-size: 16px;
	color: #555;
	font-weight: bold;
	line-height: 1;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-1 {
	left: 0;
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-2 {
	left: 11.11%;
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-3 {
	left: 22.22%;
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-4 {
	left: 33.33%;
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-5 {
	left: 44.44%;
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-6 {
	left: 55.55%;
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-7 {
	left: 66.66%;
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-8 {
	left: 77.77%;
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-9 {
	left: 88.88%;
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-10 {
	left: 100%;
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-1:after {
	content: '1';
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-2:after {
	content: '2';
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-3:after {
	content: '3';
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-4:after {
	content: '4';
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-5:after {
	content: '5';
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-6:after {
	content: '6';
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-7:after {
	content: '7';
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-8:after {
	content: '8';
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-9:after {
	content: '9';
}
.tb_wrap .filter_wrap .filter_scale .single_scale.no-10:after {
	content: '10';
}

.tb_wrap .filter_wrap:hover,
.tb_wrap .filter_wrap .filter_handle:hover,
.tb_wrap .filter_wrap  .ui-widget-header:hover,
.tb_wrap .filter_wrap .filter_scale:hover {
	cursor: pointer;
}
.tb_wrap .tb_recommend_links {
	top: 20px;
}
.tb_wrap .tb_recommend_links .tooltip--tb_recommend {
	z-index: 200;
}
.tb_icon_processing {
	display: none;
	background-color: #fff;
	padding:  40px;
	border: 4px solid #666;
	border-radius: 16px;
	position: fixed;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	-o-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	z-index: 200;
	opacity: 0.85;
	box-shadow: 0 0 8px 1px rgba(0,0,0,0.3);
}
.tb_icon_processing .icon {
	text-align: center;
	font-size: 34px;
	color: #333;
	width: 40px;
	height: 40px;
	line-height: 40px;
}
/*--------------------------------------------*/
/* tb menu
/*--------------------------------------------*/
.tb_wrap .tb_main_menu{
	margin: 0 auto;
}
.tb_wrap .tb_main_menu ul{
	font-size: 0;
}
.tb_wrap .tb_main_menu li{
	display: inline-block;
}
.tb_wrap .tb_main_menu li + li{
	margin-left: 30px;
}
.tb_wrap .tb_main_menu li a{
	display: inline-block;
	min-width: 200px;
	box-sizing: border-box;
	text-align: center;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
	color: #555;
	padding: 10px;
	border-bottom: 5px solid #eee;
	transition: all 0.2s linear;
}
.tb_wrap .tb_main_menu a.on{
	border-color: #03c9a9;
}

/*--------------------------------------------*/
/* tb sub menu
/*--------------------------------------------*/
.tb_wrap .tb_sub_menu ul{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	font-size: 0;
	margin: -10px -10px 0;
	position: relative;
}
.tb_wrap .tb_sub_menu li{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-box;
	display: -webkit-flexbox;
	display: -moz-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	-webkit-box-lines: multiple;
	-moz-box-lines: multiple;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	align-items: center;
	margin: 10px 0 0 10px;
	width: calc((100% - 40px) / 3);
	box-sizing: border-box;
	border: 1px solid #eee;
	border-bottom: 3px solid #eee;
	min-height: 56px;
	border-radius: 5px 5px 0 0;
	position:relative;
}
.tb_wrap .tb_sub_menu li .tb_sub_menu_inner{
	display: table;
	line-height: 1.5;
	width: 100%;
	position: relative;
}
.tb_wrap .tb_sub_menu li a{
	display: table-cell;
	padding: 5px 15px;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: bold;
	color: #555;
	transition: all 0.2s linear;
	vertical-align: middle;
	box-sizing: border-box;
	word-wrap: break-word;
}
.tb_wrap .tb_sub_menu li a .class_name{
	display: inline-block;
	text-align: left;
}
/* NJ-26815 */
.tb_wrap .tb_sub_menu li .class_fav{
	position:absolute;
	right:0;
	bottom:0;
}
.tb_wrap .tb_sub_menu > ul > li .class_fav .fav-star.off{
	font-size: 2rem;
  vertical-align: middle;
  color: #CCCCCC;
  transition: 0.2s all linear;
}
.tb_wrap .tb_sub_menu > ul > li .class_fav .fav-star.on{
	font-size: 2rem;
  vertical-align: middle;
  color: #F1890E;
  transition: 0.2s all linear;
}
/* NJ-26815 */
.tb_wrap .tb_sub_menu li.b_b_orange{
	border-bottom-color: #ffa436;
}
.tb_wrap .tb_sub_menu li:hover{
	border-bottom-color: #ffa436;
}
.tb_wrap.tb_wrap_studysapuri .tb_sub_menu .tb_sub_menu_inner a{
	padding: 1.8rem 0;
}
.tb_wrap.tb_wrap_studysapuri .tb_sub_menu li a .class_name{
	text-align: center;
	line-height: 1.7;
}
/*--------------------------------------------*/
/* tb sub menu-2
/*--------------------------------------------*/
.tb_wrap .tb_sub_menu-2 ul{
	font-size: 0;
}
.tb_wrap .tb_sub_menu-2 li{
	display: inline-block;

}
.tb_wrap .tb_sub_menu-2 li + li{
	margin-left: 25px;
}
.tb_wrap .tb_sub_menu-2 li a{
	display: inline-block;
	padding: 10px;
	font-size: 15px;
	font-size: 1.5rem;
	font-weight: bold;
	color: #555;
	transition: all 0.2s linear;
}
.tb_wrap .tb_sub_menu-2 li a:hover{
	border-color: #ffa436;
}

/*--------------------------------------------*/
/* tb container
/*--------------------------------------------*/
.tb_wrap .tb_container{
	padding: 15px;
	border: #d4d4d4 solid 1px;
	border-radius: 0 5px 5px 5px;
	box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.1);
}

/*--------------------------------------------*/
/* tb header item
/*--------------------------------------------*/
.tb_wrap .tb_header_item{
	padding: 15px;
	background: #fffcee;
	border: dotted 1px #eee;
	border-radius: 6px;
}
.tb_wrap .tb_header_item a{
	color: inherit;
}

/*--------------------------------------------*/
/* desc_box
/*--------------------------------------------*/
.tb_wrap .desc_box{
	border: 1px dotted #ccc;
	background: #FDFDFD;
	padding: 15px;
	line-height: 1.5;
}

/*--------------------------------------------*/
/* tb list
/*--------------------------------------------*/
.tb_wrap .tb_list{
	margin: 0 -14px;
}
.tb_wrap .tb_list > ul{
	display: table;
	width: 100%;
	table-layout: fixed;
	border-spacing: 14px 0;
}
.tb_wrap .tb_list > ul > li{
	display: table-cell;
	vertical-align: top;
	border-bottom: #eee solid 1px;
	/*border-radius: 5px;
	background: #fff;
	box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.1);*/
}
.tb_wrap .tb_list > ul:last-child > li{
	border-bottom: none;
}
.tb_wrap .tb_list .tb_item{
	position: relative;
	display: table;
	width: 100%;
	border-spacing: initial;
	color: #555;
	padding: 5px 0;
	cursor: pointer;
}
.tb_wrap .tb_list .tb_item .col_fig,
.tb_wrap .tb_list .tb_item .col_desc{
	display: table-cell;
}
.tb_wrap .tb_list .tb_item .col_fig{
	vertical-align: top;
	width: 82px;
	padding: 14px;
}
.tb_wrap .tb_list .tb_item .col_desc{
	vertical-align: middle;
	padding: 14px 14px 14px 2px;
}
.tb_wrap .tb_list .tb_item .col_desc .title{
	font-size: 16px;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.5;
}
.tb_wrap .tb_list .tb_item .col_desc .lesson_count{
	display:none;
}
.tb_wrap .tb_list .tb_item .col_desc .desc{
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 1.5;
	margin-top: 10px;
}
.tb_wrap .tb_list .tb_item .col_desc .desc_2{
	font-size:12px;
	font-size:1.2rem;
}
.tb_wrap .tb_list .tb_item .col_desc .desc_2.desc_2_course{
	position:absolute;
	bottom:8px;
	right:5px;
}
.tb_wrap .tb_list .tb_item .col_desc .desc_2.desc_2_series{
	margin-top:10px;
}
/* link */
.tb_wrap .tb_list a{
	color: inherit;
	transition: all 0.2s linear;
}
.tb_wrap .tb_list a:hover .tb_item,
.tb_wrap .tb_list .b_link:hover{
	transition: all 0.2s linear;
	background: #fffcee;
}
.tb_wrap .tb_list a .tb_item .col_desc{
	padding-right: 40px;
}
.tb_wrap .tb_list a .tb_item:after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 5px;
	width: 24px;
	height: 24px;
	margin: auto;
	font-size: 24px;
	text-align: center;
	line-height: 1;
	vertical-align: middle;
	color: #ccc;
	display: inline-block;
	content: '\f105';
	font-family: 'fontAwesome';
	opacity: 0;
	transition: all 0.2s linear;
}
.tb_wrap .tb_list a:hover .tb_item:after{
	opacity: 1;
}

/* column */
.tb_wrap .tb_list-col_1 > ul > li{
	width: 100%;
}
.tb_wrap .tb_list-col_2 > ul{
	width: auto;
}
.tb_wrap .tb_list-col_2 > ul > li{
	width: 424px;
}
.tb_wrap .tb_list-col_3 > ul{
	width: auto;
}
.tb_wrap .tb_list-col_3 > ul > li{
	width: 278px;
}
.tb_wrap .tb_list-col_4 > ul{
	width: auto;
}
.tb_wrap .tb_list-col_4 > ul > li{
	width: 205px;
}
/* tile */
.tb_wrap .tb_list-tile.tb_list-col_3{
	min-height: 278px;
}
.tb_wrap .tb_list-tile.tb_list-col_3 > ul > li .tb_item{
	min-height: 278px;
}
.tb_wrap .tb_list-tile.tb_list-col_4{
	min-height: 204px;
}
.tb_wrap .tb_list-tile.tb_list-col_4 > ul > li .tb_item{
	min-height: 204px;
}

.tb_wrap .tb_list-tile > ul > li .tb_item{
	background-position: center center;
	background-size: cover;
}
.tb_wrap .tb_list-tile > ul > li .tb_item,
.tb_wrap .tb_list-tile > ul > li .tb_item .col_fig,
.tb_wrap .tb_list-tile > ul > li .tb_item .col_desc{
	display: block;
}
.tb_wrap .tb_list-tile > ul > li .tb_item{
	overflow: hidden;
}
.tb_wrap .tb_list-tile > ul > li .tb_item .col_fig{
	position: absolute;
}
.tb_wrap .tb_list-tile > ul > li .tb_item .col_fig .ic_textbook{
	width: 100%;
	height: 100%;
	border: none;
}
.tb_wrap .tb_list-tile > ul > li .tb_item .col_fig{
	padding: 0;
	width: 100%;
}
.tb_wrap .tb_list-tile > ul > li .tb_item .col_fig .ic_textbook img{
	width: 100%;
	height: 100%;
}
.tb_wrap .tb_list-tile > ul > li .tb_item .col_desc{
	position: absolute;
	height: 100%;
	left: 0;
	right: 0;
	bottom: -55%;
	box-sizing: border-box;
	border-radius: 0 0 3px 3px;
	background: rgba(255,255,255,0.9);
	padding: 14px;
	transition: all 0.2s ease;
}
.tb_wrap .tb_list-tile > ul > li a:hover .tb_item .col_desc{
	bottom: 0;
	border-radius: 3px;
}

/*--------------------------------------------*/
/* tb item 2
/*--------------------------------------------*/
.tb_wrap .tb_item_2{
	position: relative;
	display: table;
	width: 100%;
	border-spacing: initial;
	color: #555;
}
.tb_wrap .tb_item_2 .col_fig,
.tb_wrap .tb_item_2 .col_desc{
	display: table-cell;
}
.tb_wrap .tb_item_2 .col_fig{
	vertical-align: top;
	width: 82px;
	padding-right: 20px;
}
.tb_wrap .tb_item_2 .col_desc{
	position: relative;
	vertical-align: middle;
}
.tb_wrap .tb_item_2 .col_desc .title{
	font-size: 16px;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.5;
}
.tb_wrap .tb_item_2 .col_desc .lesson_count:before{
	content:'\f02e';
	font-family:'fontAwesome';
	font-weight:bold;
	margin-right:5px;
}
.tb_wrap .tb_item_2 .col_desc .desc_wrap{
	position: relative;
}
.tb_wrap .tb_item_2 .col_desc .lesson_count{
	position: absolute;
	top: 0;
	right: 0;
	font-size: 15px;
	font-size: 1.5rem;
}
.tb_wrap .tb_item_2 .col_desc .desc{
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 1.5;
	margin-top: 10px;
	position: relative;
}
.tb_wrap .tb_item_2 .col_desc .desc_2{
	position:absolute;
	bottom:-10px;
	right:0;
	font-size:12px;
	font-size:1.2rem;
}
.tb_wrap .tb_item_2 .col_desc .data .total{

}
.tb_wrap .tb_item_2 .col_desc .data{
	padding: 12px;
	border-radius: 4px;
	background: #eee;
}
.tb_wrap .tb_item_2 .col_desc .data .total{
	font-size: 13px;
	font-size: 1.3rem;
	line-height: 1.5;
	font-weight: bold;
}
.tb_wrap .tb_item_2 .col_desc .data .data_list ul{
	font-size: 0;
	margin-left: -15px;
}
.tb_wrap .tb_item_2 .col_desc .data .data_list li{
	display: inline-block;
	font-size: 13px;
	font-size: 1.3rem;
	font-weight: normal;
	line-height: 1.5;
}
.tb_wrap .tb_item_2 .col_desc .data .data_list li:before{
	content: '・';
	margin-right: 5px;
}
.tb_wrap .tb_item_2 .col_desc .data .data_list li{
	margin-left: 15px;
}

/* link >>> */
.tb_wrap a .tb_item_2:after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 5px;
	width: 24px;
	height: 24px;
	margin: auto;
	font-size: 24px;
	text-align: center;
	line-height: 1;
	vertical-align: middle;
	color: #ccc;
	display: inline-block;
	content: '\f105';
	font-family: 'fontAwesome';
	opacity: 0;
	transition: all 0.2s linear;
}
.tb_wrap a:hover .tb_item_2:after{
	opacity: 1;
}
.tb_wrap a .tb_item_2 .col_desc{
	padding-right: 25px;
}
/* <<< link */

/*--------------------------------------------*/
/* tb item 2 (category) level
/*--------------------------------------------*/
.tb_wrap .tb_item_2 .col_desc .level{
	height: 25px;
	vertical-align: middle;
	margin: 18px 0 0 0;
}
.tb_wrap .tb_item_2 .col_desc .level dt,
.tb_wrap .tb_item_2 .col_desc .level dd{
	float: left;
	font-size: 12px;
	font-size: 1.2rem;
	height: 12px;
    line-height: 12px;
	font-weight: bold;
}
.tb_wrap .tb_item_2 .col_desc .level dt{
	padding: 1px 8px;
	background: #545555;
	color: #fff;
	margin-right: 6px;
}
.tb_wrap .tb_item_2 .col_desc .level dd{
	background: #cdcdcd;
	padding: 1px 13px;
	margin-left: 4px;
	color: #fff;
}
.tb_wrap .tb_item_2 .col_desc .level dd.on{
	color: #fff;
	background: #F1890E;
}

/*--------------------------------------------*/
/* tb sub list
/*--------------------------------------------*/
.tb_wrap .tb_sub_list .tb_sub_item + .tb_sub_item{
	margin-top: 30px;
}
.tb_wrap .tb_sub_item {
	position: relative;
}
.tb_wrap .tb_sub_item .tb_sub_item_header{
	padding: 10px 0 10px 15px;
	border-left: 8px solid #eee;
	margin-bottom: 5px;
}
.tb_wrap .tb_sub_item .tb_sub_item_header_nodesc{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
}
.tb_wrap .tb_sub_item .tb_sub_item_ttl{
	font-size: 16px;
	font-size: 1.6rem;
}
.tb_wrap .tb_sub_item .tb_sub_item_desc{
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 1.5;
	margin-top: 10px;
}

/*--------------------------------------------*/
/* tb chapter list area
/*--------------------------------------------*/
.tb_chapter_list_area{
	min-height: 500px;
}
.tb_chapter_list_area .loader{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 30px;
	height: 30px;
	font-size: 30px;
	text-align: center;
	vertical-align: middle;
	line-height: 1;
	color: #ccc;
}

/*--------------------------------------------*/
/* tb chapter list
/*--------------------------------------------*/
.tb_wrap .tb_chapter_list{
	border: 1px solid #eee;
}
.tb_wrap .tb_chapter_list > ul > li{
	position: relative;
	font-size: 14px;
	font-size: 1.4rem;
	line-height: 1.5;
}
.tb_wrap .tb_chapter_list > ul > li.disable{
	pointer-events: none;
	position: relative;
}
.tb_wrap .tb_chapter_list > ul > li.disable:before{
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: #EEE;
	opacity: .8;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	position: absolute;
	z-index: 10;
}
.tb_wrap .tb_chapter_list > ul > li + li{
	border-top: 1px solid #eee;
}
.tb_wrap .tb_chapter_list > ul > li a .desc_wrap{
	margin-right: 300px;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table{
	display: table;
	width: 100%;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table td{
	display: table-cell;
	vertical-align: middle;
}
.tb_wrap .tb_list a:hover .tb_item:after{
	opacity: 1;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table .col_index{
	display: none;
	width: 20px;
	text-align: center;
	padding: 10px 15px 10px 15px;
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: bold;
	background: #eee;
	border-bottom: #fff solid 1px;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table .col_chapter{
	padding: 10px 15px 10px;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table .col_date{
	padding: 10px 15px 10px 0;
	white-space: nowrap;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table .col_fav,.tb_wrap .tb_list_new.view_detail .tb_item_new .tb_inner .col_fav{
	width: 5rem;
}
.tb_wrap .tb_sub_menu li .tb_sub_menu_inner .col_fav{
	width: 3.6rem;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table .col_fav .fav-star.on,.tb_wrap .tb_list_new.view_detail .tb_item_new .tb_inner .col_fav .fav-star.on,.tb_wrap .tb_sub_menu li .tb_sub_menu_inner .col_fav .fav-star.on{
	font-size: 2.2rem;
	vertical-align: middle;
	color: #F1890E;
	transition: 0.2s all linear;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table .col_fav .fav-star.off,.tb_wrap .tb_list_new.view_detail .tb_item_new .tb_inner .col_fav .fav-star.off,.tb_wrap .tb_sub_menu li .tb_sub_menu_inner .col_fav .fav-star.off{
	font-size: 2.2rem;
	vertical-align: middle;
	color: #CCCCCC;
	transition: 0.2s all linear;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table .col_fav .fav-star:hover{
	opacity: 0.6;
}
.fav_tb_flash_wrap,
.set_next_tb_flash_wrap{
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	display: none;
	font-size: 1.8rem;
	width: 24rem;
	height: 4rem;
	background: rgba(0,0,0,0.6);
	color: #FFF;
	text-align: center;
	line-height: 4rem;
	border-radius: 5px;
	padding: 1rem 2rem;
	z-index: 12000;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table .class_title{
	font-weight: bold;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table .ic_textbook{
	margin-left: -4px;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table .chapter_title{
	display: block;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table .date{
	color: #999;
	font-size: 12px;
	font-size: 1.2rem;
}

/* link */
.tb_wrap .tb_chapter_list > ul > li a{
	display: block;
	color:  inherit;
	transition: all 0.2s linear;
}
.tb_wrap .tb_chapter_list > ul > li a:hover{
	background: #fffcee;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table .col_date{
	padding-right: 26px;
}
.tb_wrap .tb_chapter_list > ul > li a .chapter_item_table:after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	width: 24px;
	height: 24px;
	margin: auto;
	font-size: 24px;
	text-align: center;
	line-height: 1;
	vertical-align: middle;
	color: #ccc;
	display: inline-block;
	content: '\f105';
	font-family: 'fontAwesome';
	opacity: 0;
	transition: all 0.2s linear;
}
.tb_wrap .tb_chapter_list > ul > li a:hover .chapter_item_table:after{
	opacity: 1;
}

/*--------------------------------------------*/
/* tb chapter
/*--------------------------------------------*/
.tb_wrap .tb_chapter iframe{
	width: 100%;
	min-height: 100vh;
	height: 800px;
	overflow: scroll;
	box-sizing: border-box;
	overflow-y: scroll;
	overflow-x: hidden;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
	border: none;
	background-color: #FFF;
}
.tb_wrap .tb_chapter iframe::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 7px;
}
.tb_wrap .tb_chapter iframe::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background-color: rgba(0,0,0,0.4);
	box-shadow: 0 0 1px rgba(255,255,255,0.5);
}

/*--------------------------------------------*/
/* tb chapter btns
/*--------------------------------------------*/
.tb_wrap .tb_chapter_btns > ul{
	display: flex;
	align-items: center;
	justify-content: flex-end;
}
.tb_wrap .tb_chapter_btns > ul > li{

}
.tb_wrap .tb_chapter_btns > ul > li + li{
	margin-left: 10px;
}
.tb_wrap .tb_chapter_btns .tbc_btn {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #555;
	width: 3.5rem;
	height: 3.5rem;
	line-height: 1;
	border: #0C2A44 solid 1px;
	border-radius: .5rem;
	transition: 0.2s all linear;
}
.tb_wrap .tb_chapter_btns .tbc_btn > .btn_icon {
	display: inline-block;
	width: 25px;
	height: 25px;
	background-repeat: no-repeat;
	background-size: 25px auto;
	background-position: center;
}
.tb_wrap .tb_chapter_btns .tbc_btn > .btn_icon.icon_expand {
	background-image: url(../images/icon/expand.svg);
}
.tb_wrap .tb_chapter_btns .tbc_btn:hover {
	opacity: .6;
}

/*--------------------------------------------*/
/* tb level cource
/*--------------------------------------------*/
.tb_wrap .tb_list .tb_item .col_desc .title{
	display: inline-block;
}
.tb_wrap .tb_list .tb_item .col_desc .level{
	display: inline-block;
	vertical-align: middle;
	margin-left: 20px;
}
.tb_wrap .tb_list .tb_item .col_desc .level dt,
.tb_wrap .tb_list .tb_item .col_desc .level dd{
	float: left;
	font-size: 12px;
	font-size: 1.2rem;
	height: 14px;
    line-height: 16px;
	font-weight: bold;
}
.tb_wrap .tb_list .tb_item .col_desc .level dt{
	background: #545555;
	padding: 1px 6px;
	color: #fff;
	margin-right: 6px;
}
.tb_wrap .tb_list .tb_item .col_desc .level dd{
	background: #cdcdcd;
	padding: 1px 12px;
	margin-left: 4px;
	color: #fff;
	width: 8px;
}
.tb_wrap .tb_list .tb_item .col_desc .level dd.on{
	color: #fff;
	background: #F1890E;
}
/*--------------------------------------------*/
/* tb level category
/*--------------------------------------------*/
.tb_wrap .tb_list.tb_list-col_2 .tb_item .col_desc .level{
	width: 290px;
	display: inline-block;
	margin: 10px 0 5px;
	vertical-align: middle;
}
.tb_wrap .tb_list-col_2 .tb_item .col_desc .level dt{

}
.tb_wrap .tb_list-col_2 .tb_item .col_desc .level dd{

}
.tb_wrap .tb_list-col_2 .tb_item .col_desc .level dd.on{
	color: #fff;
	background: #F1890E;
}
.tb-not-ranked-wrap .tb_list_new .tb_item_new{
	border-top: none;
}
/*--------------------------------------------*/
/* tb level check
/*--------------------------------------------*/
/* question 1 */
.level_check_table_wrap .level_check_table th,
.level_check_table_wrap .level_check_table td{
	border: 1px #c8c8c8 solid;
}
.level_check_table_wrap .level_check_table .class{
	width: 8%;
}
.level_check_table_wrap .level_check_table .rank{
	width: 12%;
}
.level_check_table_wrap .level_check_table .desc{
	width: auto;
}
.level_check_table_wrap .level_check_table .class,
.level_check_table_wrap .level_check_table .rank,
.level_check_table_wrap .level_check_table .desc{
	padding: 15px;
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 1.5;
}
.level_check_table_wrap .level_check_table tr:nth-child(1) th{
	background: #448aca;
	color: #fff;
	text-align: center;
	padding: 10px 0;
	letter-spacing: 1.5px;
}
.level_check_table_wrap .level_check_table tr:nth-child(2) .class{ background: #f9ce9d; }
.level_check_table_wrap .level_check_table tr:nth-child(3) .class{ background: #f7b76e; }
.level_check_table_wrap .level_check_table tr:nth-child(4) .class{ background: #f4a03e; }
.level_check_table_wrap .level_check_table tr:nth-child(6) .class{ background: #f1890e; }

/* desc */
.level_check_table_wrap .level_check_table .desc .d_cell:nth-child(1){
	width: 90%;
	padding-right: 25px;
}
.level_check_table_wrap .level_check_table tr .desc .desc_ttl{
	font-weight: bold;
	font-size: 16px;
	font-size: 1.6rem;
	margin-bottom: 20px;
}
.level_check_table_wrap .level_check_table tr .desc .text_level{
	width: 70px;
	height: 70px;
	line-height: 70px;
	border-radius: 50%;
	color: #f49e39;
	border: #f49e39 2px solid;
	text-align: center;
}
.level_check_table_wrap .level_check_table tr .desc .text_level p{
	padding-top: 20%;
}
.level_check_table_wrap .level_check_table tr .desc .text_level p{
	font-family: Helvetica;
}

/*--------------------------------------------*/
/* tb desc btn
/*--------------------------------------------*/
.tb_wrap .tb_btn_area{
	font-size: 0;
	margin: 2rem auto;
	text-align: center;
}
.tb_wrap .tb_btn_area .btn_wrap{
	display: inline-block;
	text-align: left;
	box-sizing: border-box;
	margin: auto;
}
.tb_wrap .tb_btn_area li{
	display: inline-block;
	text-align: center;
	margin: 0 auto 12px;
}
.tb_wrap .tb_btn_area .tb_desc_btn{
	display: block;
	text-decoration: none;
	width: 280px;
	border: #00acee 1px solid;
	color: #00acee;
	border-radius: 5px;
	padding: 15px;
	box-sizing: border-box;
	margin: 0 10px;
	font-size: 15px;
	font-size: 1.5rem;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}
/*--------------------------------------------*/
/*--------------- tb list new ----------------*/
/*--------------------------------------------*/
.tb_list_new {

}
.tb_list_new .tb_item_new {
	border-top: 1px solid #eee;
	box-sizing: border-box;
}
.tb_list_new .tb_item_new .tb_link {
	display: block;
	background-color: #fff;
	color: #555;
	transition: background-color 0.2s ease-in-out;
	width: 100%;
}
.tb_list_new .tb_item_new .tb_link:hover {
	background-color: #fffcee;
	box-sizing: border-box;
}
.tb_list_new .tb_item_new .tb_inner {
	display: flex;
	box-sizing: border-box;
	padding: 14px 14px 14px 14px;
	align-items: center;
}
.tb_list_new .tb_item_new .tb_inner .tb_icon_wrap {

}
.tb_list_new .tb_item_new .tb_inner .tb_icon_wrap .tb_icon {
	display: block;
	width: 100px;
	height: 100px;
	border-radius: 6px;
	overflow: hidden;
	font-size: 0;
}
.tb_list_new .tb_item_new .tb_inner .tb_icon_wrap .tb_icon img {
	width: 100%;
	height: 100%;
	display: block;
	opacity: 1;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap {
	flex: 1;
	padding-left: 14px;
	display: flex;
	align-items: center;
	position: relative;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .tb_desc_inner {
	width: 100%;
	/* NJ-26815 */
	position:relative;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .tb_desc_inner .class_fav{
	position:absolute;
	top:50%;
	right:0;
	transform: translateY(-50%);
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .tb_desc_inner .class_fav .fav-star.off{
	font-size: 2.2rem;
  vertical-align: middle;
  color: #CCCCCC;
  transition: 0.2s all linear;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .tb_desc_inner .class_fav .fav-star.on{
	font-size: 2.2rem;
  vertical-align: middle;
  color: #F1890E;
  transition: 0.2s all linear;
}
/* NJ-26815 */
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .head {
	display: flex;
	align-items: center;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .head .tb_ttl {
	font-size: 16px;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.5;
	padding-right: 20px;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .level {
	display: flex;
	flex: 1;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .level dt,
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .level dd {
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
	min-width: 22px;
	height: 16px;
	font-size: 12px;
	line-height: 1;
	color: #fff;
	background-color: #cdcdcd;
	padding: 0 6px;
	font-weight: bold;
	border-radius: 2px;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .level dt {
	background-color: #545555;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .level dd {
	margin-left: 4px;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .level dd + dd {
	margin-left: 4px;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .level dd.on {
	background-color: #f1890e;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .desc_text {
	color: #555;
	margin-top: 5px;
	font-size: 15px;
	line-height: 1.4;
	word-break: break-all;
}
.tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .head + .desc_text {
	margin-top: 10px;
}
/*------------- tb list new - 2 columns --------------*/
.tb_list_new.view_2cols {
	display: flex;
	flex-wrap: wrap;
}
.tb_list_new.view_2cols .tb_item_new {
	width: calc(50% - 7px);
	box-sizing: border-box;
}
.tb_list_new.view_2cols .tb_item_new:nth-child(even) {
	margin-left: 14px;
}
.tb_list_new.view_2cols .tb_item_new .tb_link {
	height: 100%;
}
.tb_list_new.view_2cols .tb_item_new .tb_inner {
	height: 100%;
	align-items: flex-start;
	padding: 20px 14px;
}
.tb_list_new.view_2cols .tb_item_new .tb_inner .tb_icon_wrap .tb_icon {
	width: 80px;
	height: 80px;
}
.tb_list_new.view_2cols .tb_item_new .tb_inner .tb_desc_wrap .head {
	display: block;
}
.tb_list_new.view_2cols .tb_item_new .tb_inner .tb_desc_wrap .head .tb_ttl {
	margin-bottom: 10px;
	padding-right: 0;
}
/*------------- tb list new - detail view --------------*/
.tb_list_new.view_detail .tb_item_new {
	border: 1px solid #f5f5f5;
	border-radius: 6px;
	overflow: hidden;
	display: flex;
}
.tb_list_new.view_detail .tb_item_new .tb_inner {
	background-color: #fffcee;
	flex: 1;
}
.tb_list_new.view_detail .tb_item_new .tb_inner .tb_desc_wrap .head {
	display: block;
}
.tb_list_new.view_detail .tb_item_new .tb_inner .tb_desc_wrap .head .tb_ttl {
	margin-bottom: 15px;
}
.tb_list_new.view_detail .tb_item_new .tb_inner .tb_desc_wrap .head + .desc_text {
	margin-top: 20px;
}
.tb_list_new.view_detail .tb_item_new .tb_inner .tb_desc_wrap .head .lesson_number {
	display: flex;
	align-items: center;
	gap: 0 5px;
	/* position: absolute; */
	top: 0;
	right: 0;
	color: #555;
	font-size: 1.6rem;
	margin-top: 17px;
}
.tb_list_new.view_detail .tb_item_new .tb_inner .tb_desc_wrap .head .lesson_number:before {
	content: '';
	display: block;
	width: 16px;
	height: 20px;
	background: url(../images/icon/book.svg) no-repeat center / contain;
}
/*------------- tb list new - studysapuri --------------*/
.tb_list_new.tb_list_studysapuri .tb_item_new {
	border-top: none;
	border-bottom: 1px solid #eee;
}
/*--------------------------------------------*/
/*------------ tb level table new ------------*/
/*--------------------------------------------*/
.tb_level_table_new {
	width: 100%;
	background-color: #fff;
}
.tb_level_table_new thead {
	background-color: #448aca;
	border: 1px solid #265480;
}
.tb_level_table_new thead th {
	width: 20%;
	text-align: center;
	color: #fff;
	font-weight: bold;
	font-size: 14px;
	line-height: 1;
	padding: 15px 5px;
	box-sizing: border-box;
}
.tb_level_table_new thead th:not(:first-child) {
	border-left: 1px solid #265480;
}
.tb_level_table_new thead .cell_lv {
	width: 12%;
}
.tb_level_table_new thead .cell_item {
	width: 10%;
}
.tb_level_table_new thead .cell_item.toeic {
	width: 16%;
}
.tb_level_table_new thead .cell_item.versant {
	width: 12%;
}
.tb_level_table_new thead .cell_desc{
	width: auto;
}
.tb_level_table_new tbody {
	border: 1px solid #ccc;
	border-top: none;
}
.tb_level_table_new tbody tr:not(:first-child) {
	border-top: 1px solid #ccc;
}
.tb_level_table_new tbody tr:nth-child(even) {
	background-color: #fff9f2;
}
.tb_level_table_new tbody th,
.tb_level_table_new tbody td {
	padding: 20px 5px;
	text-align: center;
	vertical-align: middle;
}
.tb_level_table_new tbody td.cell_item {
	font-size: 18px;
	font-weight: bold;
	color: #333;
}
.tb_level_table_new tbody td.cell_item.cefr {
	font-size: 2rem
}
.tb_level_table_new tbody td.cell_desc {
	text-align: left;
	padding-left: 15px;
	padding-right: 15px;
}
.tb_level_table_new tbody td {
	border-left: 1px solid #ccc;
}
.tb_level_table_new .lv_icon {
	display: inline-flex;
	flex-wrap: wrap;
	box-sizing: border-box;
	width: 74px;
	height: 74px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	overflow: hidden;
	border: #f49e39 2px solid;
	color: #f49e39;
	padding-top: 6px;
}
.tb_level_table_new .lv_icon .lv_icon_inner {
	display: block;
	font-family: Helvetica;
	box-sizing: border-box;
	text-align: center;
	font-size: 16px;
	font-weight: bold;
	line-height: 1;
}
.tb_level_table_new .lv_icon .lv_icon_inner .lv_number {
	font-size: 36px;
	font-weight: normal;
}
.tb_level_table_new .desc_list dt {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 10px;
	line-height: 1.4;
	color: #333;
}
.tb_level_table_new .desc_list dd {
	font-size: 14px;
	line-height: 1.6;
}
.tb_level_table_new .btn_level_wrap {
	text-align: center;
	margin-top: 10px;
}
.tb_level_table_new .btn_level_wrap .btn_level {
	min-width: 180px;
}
.tb_level_table_new .btn_level_wrap .btn_level_number {
	font-size: 30px;
	font-weight: bold;
}

/* tb sub menu */
.tb_chapter_btns {
	position: absolute;
	bottom: calc(100% + 16px);
	right: 0;
}
.tb_chapter_btns .sub_menu_wrap .btn_sub_menu{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3.5rem;
	height: 3.5rem;
	color: #000;
	border: #0C2A44 solid 1px;
	border-radius: .5rem;
	transition: 0.2s all linear;
}
.tb_chapter_btns .sub_menu_wrap .btn_sub_menu:hover{
	opacity: 0.6;
}
.tb_chapter_btns .sub_menu_wrap .sub_menu{
	border: #ccc 1px solid;
	box-shadow: 2px 2px 3px rgba(0,0,0,0.2);
	position: absolute;
	top: 100%;
	right: 0;
	margin: auto;
	background: #FFF;
	width: max-content;
	z-index: 10;
	border-radius: 0.5rem;
}
.tb_chapter_btns .sub_menu_wrap .sub_menu > ul > li{
	display: block;
}
.tb_chapter_btns .sub_menu_wrap .sub_menu > ul > li i{
	margin-right: 1rem;
	font-size: 2.2rem;
}
.tb_chapter_btns .sub_menu_wrap .sub_menu > ul > li .dictionary_icon{
	background-image: url(https://assets.nativecamps.com/user/webroot/images/class/dictionary_dark.svg);
	background-repeat: no-repeat;
	height: 2.2rem;
	width: 2.2rem;
}
.tb_chapter_btns .sub_menu_wrap .sub_menu > ul > li .dictionary:hover .dictionary_icon{
	background-image: url(https://assets.nativecamps.com/user/webroot/images/class/dictionary.svg);
	background-repeat: no-repeat;
	height: 2.2rem;
	width: 2.2rem;
}
.tb_chapter_btns .sub_menu_wrap .sub_menu > ul > li + li{
	margin: auto;
}
.tb_chapter_btns .sub_menu_wrap .sub_menu > ul > li .sub_menu_item{
	color: #555;
	transition: 0.2s all linear;
	padding: 1.4rem 1.5rem;
	display: flex;
	align-items: center;
}
.tb_chapter_btns .sub_menu_wrap .sub_menu > ul > li .sub_menu_item:hover{
	color: #FFF;
	background-color: #F1890E;
}
.tb_chapter_btns .sub_menu_wrap .sub_menu > ul > li .sub_menu_item .fa-star{
	color: #FCC925;
}

/* SNS share links */
.page_wrap--textbook .social_links{
	text-align: center;
	margin: 3rem 0 1rem;
}
.page_wrap--textbook .social_links .btn_footer {
	position: relative;
	display: inline-block;
	width: 3.2rem;
	height: 3.2rem;
	margin: 0 0.8rem;
	text-decoration: none;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;	
}
.page_wrap--textbook .social_links .btn_footer-facebook{
	background-image: url('./../images/common/icon_facebook.png');
}
.page_wrap--textbook .social_links .btn_footer-twitter {
    background-image: url('./../images/common/icon_x.png');
}
.page_wrap--textbook .social_links .btn_footer-line {
    background-image: url('./../images/common/icon_line.png');
}
.page_wrap--textbook .social_links .btn_footer-x {
    background-image: url('./../images/common/icon_x.png');
}
/* End SNS share links */

/* search */
.search_area{
	margin-bottom: 30px;
}
.search_area .search_box{
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
.search_area .search_box .tb_search_form{
	height: 38px;
	width: 260px;
	box-sizing: border-box;
}
.search_area .search_box .btn_tb_search{
	border: none;
	/* background: #00ADB4; */
	padding: 0;
	margin-left: 5px;
	transition: .2s all linear;
}
.search_area .search_box .btn_tb_search:hover{
	opacity: .6;
}
/* ranking */
.tab-course .tb_list_new .tb_item_new .tb_inner .tb_rank_wrap{
	width: 64px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin-right: 14px;
}
.tab-course .tb_list_new .tb_item_new .tb_inner .tb_rank_wrap .rank{
	color: #E15151;
	font-size: 2rem;
	font-weight: bold;
}
.tab-course .tb_list_new .tb_item_new_1 .tb_inner .tb_rank_wrap:before{
	content: url('../images/textbook/crown_gold.png')
}
.tab-course .tb_list_new .tb_item_new_2 .tb_inner .tb_rank_wrap:before{
	content: url('../images/textbook/crown_silver.png')
}
.tab-course .tb_list_new .tb_item_new_3 .tb_inner .tb_rank_wrap:before{
	content: url('../images/textbook/crown_bronze.png')
}
.tab-course .tb_list_new .tb_item_new.tb_item_new_1 .tb_inner .tb_rank_wrap .rank,
.tab-course .tb_list_new .tb_item_new.tb_item_new_2 .tb_inner .tb_rank_wrap .rank,
.tab-course .tb_list_new .tb_item_new.tb_item_new_3 .tb_inner .tb_rank_wrap .rank{
	font-size: 2.4rem;
}
.tab-course .tb_list_new .tb_item_new .tb_inner .tb_rank_wrap:before{
	margin-bottom: 10px;
}
.tab-series .tb_list_new .tb_item_new .tb_inner .tb_rank_wrap{
	width: 64px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin-right: 14px;
}
.tab-series .tb_list_new .tb_item_new .tb_inner .tb_rank_wrap .rank{
	color: #E15151;
	font-size: 2rem;
	font-weight: bold;
}
.tab-series .tb_list_new .tb_item_new.tb_item_new_1 .tb_inner .tb_rank_wrap .rank,
.tab-series .tb_list_new .tb_item_new.tb_item_new_2 .tb_inner .tb_rank_wrap .rank,
.tab-series .tb_list_new .tb_item_new.tb_item_new_3 .tb_inner .tb_rank_wrap .rank{
	font-size: 2.4rem;
}
.tab-series .tb_list_new .tb_item_new_1 .tb_inner .tb_rank_wrap:before{
	content: url('../images/textbook/crown_gold.png')
}
.tab-series .tb_list_new .tb_item_new_2 .tb_inner .tb_rank_wrap:before{
	content: url('../images/textbook/crown_silver.png')
}
.tab-series .tb_list_new .tb_item_new_3 .tb_inner .tb_rank_wrap:before{
	content: url('../images/textbook/crown_bronze.png')
}
.tab-series .tb_list_new .tb_item_new .tb_inner .tb_rank_wrap:before{
	margin-bottom: 10px;
}
.tab-series .tb_list_new .tb_item_new .tb_inner .tb_rank_footer{
	width: 64px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin-right: 14px;
	margin-top: 50px;
}
/* search result */
.result_detail_wrap + .result_detail_wrap{
	margin-top: 20px;
}
.result_detail_wrap .sec_title{
	color: #235770;
	font-weight: bold;
	font-size: 2rem;
	margin-bottom: 10px;
}
.result_detail_wrap .result_detail{
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
}
.result_detail_wrap .no_result_wrap{
	display: flex;
	align-items: center;
	padding: 30px 5px;
}
.result_detail_wrap .no_result_wrap .img_wrap{
	margin-right: 10px;
}
.result_detail_wrap .result_detail .chapter_wrap{
	padding: 30px 5px;
}
.result_detail_wrap .result_detail .chapter + .chapter{
	margin-top: 20px;
}
.result_detail_wrap .result_detail .chapter .chapter_title{
	font-weight: bold;
	font-size: 1.8rem;
}
.result_detail_wrap .result_detail .chapter .chapter_info{
	margin-top: 10px;
}
.result_detail_wrap .result_detail .chapter .chapter_info > span:after{
	content: ">";
	display: inline;
	padding: 0 8px;
}
.result_detail_wrap .result_detail .category_wrap{
	padding: 30px 5px;
}
.result_detail_wrap .result_detail .category + .category{
	margin-top: 20px;
}
.result_detail_wrap .result_detail .category .category_title{
	font-weight: bold;
	font-size: 1.8rem;
}
.result_detail_wrap .result_detail .category .category_info{
	margin-top: 10px;
}
.result_detail_wrap .result_detail .category .category_info > span:after{
	content: ">";
	display: inline;
	padding: 0 8px;
}
.result_wrap .pager{
	display: flex;
	justify-content: center;
	align-items: center;
	color: #092846;
}
.result_wrap .pager a {
	color: #092846;
}
.result_wrap .pager .page{
	display: flex;
	justify-content: center;
	align-items: center;
}
.result_wrap .pager .page + .page{
	margin-left: 5px;
}
.result_wrap .pager .page a{
	border: 1px solid #092846;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height:	30px;
	transition: .2s all linear;
}
.result_wrap .pager .page a:hover{
	opacity: .6;
}
.result_wrap .pager .on{
	background: #092846;
	color: #FFF;
}

/* 
	NJ-5802
	Play Recorded Audio From Lesson History
	View Chat At The Same Time
	Fullscreen Support
*/
.page-inner-tb-and-chat {
	width: 96rem;
	max-width: 122rem;
	margin: 0 auto;
}
.page-inner-tb-and-chat.has-chat {
	width: 122rem;
}

.tb-fullscreen-wrap {
	box-shadow: 0 0 .5rem rgba(0,0,0,.15);
}
.tb-fullscreen-wrap .tb-fullcreen-overlay {
	display: none;
}
.tb-and-chat-group {
	display: flex;
	align-items: stretch;
	justify-content: flex-start;
	background-color: #fff;
	height: calc(100vh - 15.7rem);
	/* NJ-97932 fix: changeTbHeight_card() (page_break textbooks with translation ON
	   or zoom) used to sync an inline height from the iframe content, so short
	   textbook pages shrank the whole view (empty page background showing below,
	   transcript panel collapsing with it). The JS no longer stretches the group,
	   and this min-height is a defensive clamp so no inline height can ever shrink
	   the view below the viewport. Non-page_break textbooks (Daily News etc.)
	   stretch the iframe/wrapper — not this group — and are unaffected. */
	min-height: calc(100vh - 15.7rem);
}
.tb-fullscreen-wrap:not(.on) {
	min-height: calc(100vh - 15.7rem);
}
.tb-and-chat-group > .area-tb {
	width: 100%;
	flex-shrink: 0;
	height: 100%;
}
.tb-and-chat-group .area-tb.ui-resizable:after {
	content: '\f065';
	font-family: 'fontAwesome';
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	left: 100%;
	top: 50%;
	font-size: 14px;
	line-height: 1;
	width: 20px;
	height: 20px;
	color: #fff;
	background-color: #000;
	border-radius: 4px;
	transform:  translate(-50%, -50%) rotate(45deg);
	z-index: 2;
}
.tb-and-chat-group.has-chat > .area-tb {
	width: 82rem;
	max-width: 96rem;
	min-width: 70rem;
}
.tb-fullscreen-wrap .tb-iframe {
	width: 100%;
	height: 100%;
}
.tb-fullscreen-wrap .tb-iframe > iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: none;
	box-shadow: none;
	overflow: auto;
	/* min-height: 700px; */
}
/* NJ-97932 fix: on the lesson-note review screen, keep the textbook iframe at
   least as tall as its column even when the JS height-sync writes a smaller
   inline height for short textbook pages. The bottom-pinned pop player then
   stays at the bottom of the visible textbook area instead of floating mid-page. */
.tb-and-chat-group.has-chat .tb-iframe > iframe {
	min-height: 100%;
}
.tb-and-chat-group > .area-chat {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	height: 100%;
	overflow: hidden;
}
.tb-and-chat-group .area-chat .chat-head {
	position: relative;
	z-index: 1;
	height: 5rem;
	background-color: #fff;
	border-bottom: 1px solid #CCCCCC;
}
.tb-and-chat-group .area-chat .chat-head .teacher-info {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	padding: 0 1rem;
}
.tb-and-chat-group .area-chat .chat-head .teacher-info .teacher-avatar {
	flex-shrink: 0;
}
.tb-and-chat-group .area-chat .chat-head .teacher-info .teacher-avatar .avatar-img {
	width: 4rem;
	height: 4rem;
	border-radius: 50%;
	box-shadow: 0 0 .5rem rgba(0,0,0,.25);
	overflow: hidden;
}
.tb-and-chat-group .area-chat .chat-head .teacher-info .teacher-name {
	font-size: 1.6rem;
	font-weight: bold;
	margin: 0 1rem;
}
.tb-and-chat-group .area-chat .chat-head .teacher-flag {
	flex-shrink: 0;
}
.tb-and-chat-group .area-chat .chat-head .teacher-flag .flag-img {
	width: 2rem;
	box-shadow: 0 0 .5rem rgba(0,0,0,.25);
}
.tb-and-chat-group .area-chat .chat-head .teacher-flag .flag-img > img {
	display: block;
	width: 100%;
}
.tb-and-chat-group .area-chat .chat-head .teacher-info .teacher-avatar .avatar-img > img {
	display: block;
	width: 100%;
}
.tb-and-chat-group .area-chat .chat-body {
	flex: 1;
	overflow: auto;
}
.tb-and-chat-group .area-chat .chat-body > .chat-content {
	padding: 2rem 1.2rem 5rem;
}
/* fullscreen styles */
.tb-fullscreen-wrap.on {
	height: calc(100vh - 23rem);
}
.tb-fullscreen-wrap.on .tb-fullscreen-overlay {
	display: block;
	position: fixed;
	z-index: 99998;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background-color: rgba(0,0,0,.75);
}
.tb-fullscreen-wrap.on .tb-and-chat-group {
	position: fixed;
	z-index: 99999;
	height: 100vh;
	top: 0;
	left: 50%;
	width: 96rem;
	transform: translateX(-50%);
}
.tb-fullscreen-wrap.on .tb-and-chat-group.has-chat {
	width: 122rem;
}
/* NJ-10434 */
/* html:has(#textbook_content_wrapper) { 
	overflow: hidden;
} */
#textbook_content_wrapper {
	padding-top: calc(5.2rem + 1.6rem);
}
#textbook_content_wrapper a.func-tb-enter-fullscreen {
	display: none;
}
.global_menu.scrolled .global_menu_inner .logo_wrap img.logo_img ,.global_menu.page-detail .global_menu_inner .logo_wrap img.logo_img {
	width: 100%;
}
.text_page_detail_header_wrap .logo_image {
	max-width: 156px;
}
#tb-fullscreen-wrap {
	background-color: #fff;
}

/* NJ-33115 */
.tb_list_new.view_detail .tb_item_new--has-bookmark {
	overflow: initial;
}
.tb_list_new.view_detail .tb_item_new--has-bookmark .tb_inner {
	position: relative;
}
.tb_list_new.view_detail .tb_item_new--has-bookmark .bookmark-img {
	position: absolute;
	top: 0;
	right: 1.5rem;
	z-index: 1;
}
.tb_list_new.view_detail .tb_item_new--has-bookmark .bookmark-img:hover {
	cursor: pointer;
}
.tb_list_new.view_detail .tb_item_new--has-bookmark .bookmark-details-container {
	display: none;
	position: absolute;
	top: 5px;
	right: 21px;
	z-index: 1;
	box-sizing: border-box;
	width: 28.6rem;
	background-color: #fff;
	color: #555;
	font-size: 1.4rem;
	padding: 1.5rem;
	border-radius: 4px;
	box-shadow: 0px 1px 6px rgba(0, 0, 0, 0.16);
}
.tb_list_new.view_detail .tb_item_new--has-bookmark .bookmark-details-container.active{
	display: block;
}
.tb_list_new.view_detail .tb_item_new--has-bookmark .bookmark-title {
	font-size: 1.5rem;
	font-weight: 700;
}
.tb_list_new.view_detail .tb_item_new--has-bookmark .bookmark-details {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	column-gap: 0.8rem;
	padding: 0.4rem 0 0;
	border-bottom: 1px solid #EDEDED;
	font-size: 1.4rem;
	line-height: 1.43;
}
.tb_list_new.view_detail .tb_item_new--has-bookmark .bookmark-details.stage {
	padding-top: 0.8rem;
}
/* NJ-33115 END */

/* NJ-29496 START */
.tb_wrap .tb_top_wrap .sec_1 .diagnosis_wrap {
	position: relative;
	right: unset;
	bottom: unset;
	margin-left: 10px;
}

.tb_wrap .tb_top_wrap .sec_1 {
	display: flex;
}

.tb_wrap .tb_top_wrap .sec_1 .text {
	width: calc(100% - 290px);
}
/* NJ-29496 END */

/* NJ-10549 START */
.page-tb-lessons .tb_list_new.view_detail .tb_item_new {
	border: inherit;
}
.page-tb-lessons .tb_list_new.view_detail .tb_item_new .tb_inner {
	background-color: inherit;
}
.page-tb-lessons .tb_list_new .tb_item_new .tb_inner {
	padding: inherit;
	align-items: inherit;
}
.page-tb-lessons .tb_list_new .tb_item_new {
	border-top: inherit;
}
.page-tb-lessons .tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .head .tb_ttl {
	font-size: 18px;
	font-size: 1.8rem;
}
.page-tb-lessons .tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .desc_text {
	font-size: 1.6rem;
}
.page-tb-lessons .tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .level dt,
.page-tb-lessons .tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .level dd {
	height: 24px;
	font-size: 1.4rem;
	border-radius: 4px;
}
.page-tb-lessons .tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .level dt {
	width: 54px;
}
.page-tb-lessons .tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .level dd {
	width: 30px;
}
.page-tb-lessons .tb_list_new .tb_item_new .tb_inner .tb_desc_wrap .level dd + dd {
	margin-left: 5px;
}
.page_wrap--textbook .fav-wrap{
	position: absolute;
	right: 0;
	top: 40.65px;
}
.page_wrap--textbook .fav-wrap .btn-fav{
	width: 22px;
	height: 18.69px;
	background: url(../images/icon/fav-off.svg) no-repeat center / contain;
	cursor: pointer;
	transition: .2s all linear;
}
.page_wrap--textbook .fav-wrap .btn-fav.on{
	background-image: url(../images/icon/fav-on.svg);
}
.page_wrap--textbook .tb_sub_menu_inner .fav-wrap{
	right: 15px;
	top: 50%;
	transform: translateY(-50%);
}
.page_wrap--textbook .tb_wrap .tb_list_new.view_detail .tb_item_new .tb_inner .col_fav{
	position: absolute;
	right: 0;
	top: 40.65px;
}
.page_wrap--textbook .tb_wrap .tb_sub_menu li .tb_sub_menu_inner .col_fav .fav_btn_tb,
.modal_window .tb_wrap .tb_sub_menu li a.fav_btn_tb{
	position: absolute;
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
	padding: 0;
}
/* NJ-10549 END */

.page_wrap.page_wrap--textbook_chapter .tb_wrap{
	margin-top: 16px;
}

/* NJ-67418 START */
.tb_item_new .chapter-ctrl{
	width: 40px;
	background: #092846;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
}
.tb_item_new .chapter-ctrl.chapter-prev{
	border-radius: 6px 0 0 6px;
}
.tb_item_new .chapter-ctrl.chapter-next{
	border-radius: 0 6px 6px 0 ;
}
.tb_item_new .chapter-ctrl.chapter-prev:before,
.tb_item_new .chapter-ctrl.chapter-next:before{
	content: "";
	width: 12px;
	height: 22px;
	background: url('https://assets.nativecamps.com/user/webroot/images/icon/arrow-left-white.svg') no-repeat center;
	background-size: contain;
}
.tb_item_new .chapter-ctrl.chapter-next:before{
	background: url('https://assets.nativecamps.com/user/webroot/images/icon/arrow-right-white.svg') no-repeat center;
	background-size: contain;
}
.tb_item_new .chapter-ctrl.disabled{
	pointer-events: none;
	background: #EEEEEE;
}
/* NJ-67418 END */
/* NJ-66299 */
.t_link.tb_desc_btn.t_link_style{
	text-decoration: none;
}
/* NJ-66299 END*/
/* NJ-65028 */
.page_wrap--textbook .dictionary_li {
	position: relative;
}
.page_wrap--textbook .dictionary_panel .panel_inner{
	position: relative;
}
.page_wrap--textbook .dictionary_panel .panel_inner::before{
	content: '';
	position: absolute;
	height: 3rem;
	width: 3rem;
	right: -2rem;
	transform: rotate(45deg);
	top: 6rem;
	background: #FFF;
	border-top: 0.4rem solid #4e4e4e;
	border-right: 0.4rem solid #4e4e4e;
}
.page_wrap--textbook .dictionary_panel {
	width: 55.4rem;
	height: 20.5rem;
	border: 0.4rem solid #4E4E4E;
	padding: 3.5rem 0 0 3.8rem;
	background: #FFFFFF;
	position: absolute;
	right: 115%;
	bottom: -9.5rem;
}
.page_wrap--textbook .dictionary_panel label.custom_radio::before {
	width: 2rem;
	height: 2rem;
	border: 0.1rem solid #4E4E4E;
}
.page_wrap--textbook .dictionary_panel label.custom_radio {
	padding: 0 0 0 3rem;
}
.page_wrap--textbook .dictionary_panel input[type="radio"]:checked + label.custom_radio::after {
	left: 0.5rem;
  	margin-top: -0.5rem;
}
.tb_chapter_btns .sub_menu_wrap .sub_menu > ul > li .sub_menu_item.dictionary.active{
	color: #FFF;
	background-color: #F1890E;
}
.tb_chapter_btns .sub_menu_wrap .sub_menu > ul > li .sub_menu_item.dictionary.active .dictionary_icon{
	background-image: url(https://assets.nativecamps.com/user/webroot/images/class/dictionary.svg);
	background-repeat: no-repeat;
	height: 2.2rem;
	width: 2.2rem;
}
.dictionary_panel .dictionary_item_wrap .item.m_b_15{
	padding: 0.4rem 0;
}
/* NJ-65028 END */

/* NJ-62762 START*/
.page-inner-tb-and-chat.has-chat .lesson-info-header {
    display: flex;
    background: #000000;
    padding: .5rem 1.1rem;
    align-items: center;
    gap: 1.6rem;
}
.page-inner-tb-and-chat.has-chat .lesson-info-header button.pop-player-link {
    border: 1px solid #4A4A4A;
	border-radius: 2px;
    background: #292929;
    font-size: 1.4rem;
    font-weight: 700;
    color: #fff;
    padding: .5rem 1.6rem;
}
.page-inner-tb-and-chat.has-chat .lesson-info-header button.lesson_audio_fav_icon {
    border: none;
	background: none;
}
.page-inner-tb-and-chat.has-chat .lesson-info-header .lesson-info {
    color: #fff;
	font-weight: 700;
}
/* NJ-62762 END */
/* NJ-45194 DailyNews Bookmark CSS Start */
.daily_news_bookmark_list_area {
    border: 1px solid #EEEEEE;
    background: #FFFFFF;
}
.daily_news_bookmark_list_area:hover {
    border: 1px solid #EEEEEE;
    background: #FFFBEC;
    cursor: pointer;
}
.daily_news_bookmark_cont,
.daily_news_bookmark_list_area .textbook_bookmark_cont {
	display: flex;
	gap: 2rem;
	justify-content: flex-start;
    height: 7.5rem;
	width: 39rem;
    margin: 2rem;
}
.daily_news_bookmark_cont > img {
	width: 5rem;
	height: 6.6rem;
	background-image: url(https://textbooks.nativecamps.com/resources/callan_method/images/bookmark_on.svg);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}
.daily_news_bookmark_cont ul li,
.daily_news_bookmark_list_area .textbook_bookmark_cont ul li  {
    font-weight: 700;
    font-size: 1.6rem;
    color: #555555;
	letter-spacing: 0;
    margin-bottom: 0.4rem;
}
/* NJ-45194 DailyNews Bookmark CSS End */

/* NJ-55495 */
.tb-and-chat-group .area-chat .action_list {
	background-color: #fff;
	border-bottom: 1px solid #e0e0e0;
	padding: 0 0 0.7rem;
}
.tb-and-chat-group .area-chat .action_list > .inner {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 4.8rem;
	padding: 1.6rem 3.2rem 0;
}
.tb-and-chat-group .area-chat .action_list .action_list-item {
	color: #7f7f7f;
	text-align: center;
	font-weight: 700;
	font-size: 1.2rem;
	line-height: 1.4;
	position: relative;
	max-width: 8rem;
	width: 100%;
}
.tb-and-chat-group .area-chat .action_list .action_list-item.active {
	color: #03c9a9;
}
/* NJ-92200: FR-008 — grayed-out, non-clickable disabled state for transcription tab */
.tb-and-chat-group .area-chat .action_list .action_list-item.is-disabled {
	opacity: .4;
	cursor: default;
	pointer-events: none;
}
.tb-and-chat-group .area-chat .action_list .action_list-item.active::after {
	content: "";
	position: absolute;
	bottom: -.7rem;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	height: .4rem;
	background-color: #03c9a9;
}
.tb-and-chat-group .area-chat .action_list .action_list-item .inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .5rem;
}
.tb-and-chat-group .area-chat .action_list .action_list-item .inner > i {
	width: 2rem;
	height: 2rem;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.tb-and-chat-group .area-chat .action_list .action_list-item .inner > i.icon_message {
	background-image: url(https://nativecamp-public-web-production.s3.amazonaws.com/user/webroot/images/textbook/icon/icon_message.svg);
}
.tb-and-chat-group .area-chat .action_list .action_list-item .inner > i.icon_chat {
	background-image: url(https://nativecamp-public-web-production.s3.amazonaws.com/user/webroot/images/textbook/icon/icon_chat.svg);
}
.tb-and-chat-group .area-chat .action_list .action_list-item .inner > i.icon_note {
	background-image: url(https://nativecamp-public-web-production.s3.amazonaws.com/user/webroot/images/textbook/icon/icon_note.svg);
}
.tb-and-chat-group .area-chat .action_list .action_list-item.active .inner > i.icon_message {
	background-image: url(https://nativecamp-public-web-production.s3.amazonaws.com/user/webroot/images/textbook/icon/icon_message_active.svg);
}
.tb-and-chat-group .area-chat .action_list .action_list-item.active .inner > i.icon_chat {
	background-image: url(https://nativecamp-public-web-production.s3.amazonaws.com/user/webroot/images/textbook/icon/icon_chat_active.svg);
}
.tb-and-chat-group .area-chat .action_list .action_list-item.active .inner > i.icon_note {
	background-image: url(https://nativecamp-public-web-production.s3.amazonaws.com/user/webroot/images/textbook/icon/icon_note_active.svg);
}

.tb-and-chat-group .area-chat .tb-fullscreen-wrap .no-audio-popup {
	display: flex;
	align-items: center;
	justify-content: center;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: rgba(0, 0, 0, 0.7);
	color: #fff;
	padding: 2.7rem 12.8rem;
	border-radius: 0.8rem;
	z-index: 100000;
	width: 40rem;
	height: 8rem;
	box-sizing: border-box;
}

.tb-and-chat-group .area-chat .tb-fullscreen-wrap .no-audio-popup p {
	font-size: 1.8rem;
	line-height: 1.44;
	white-space: nowrap;
	margin: 0;
}

.tb-and-chat-group .area-chat .tb-fullscreen-wrap .no-audio-popup.hide{
	display: none;
}

.tb-and-chat-group .area-chat .tb-fullscreen-wrap .no-audio-popup-overlay {
	display: block;
	position: fixed;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 99999;
	pointer-events: auto;
}
.tb-and-chat-group .area-chat .tb-fullscreen-wrap .no-audio-popup-overlay.hide {
	display: none;
	pointer-events: none;
}

.tb-and-chat-group .area-chat .message-teacher-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2rem;
    background-color: #F5F5F5;
    border-radius: 0.6rem;
}

.tb-and-chat-group .area-chat .teacher-info-details {
    display: flex;
    align-items: center;
}

.tb-and-chat-group .area-chat .teacher-info-details .teacher-avatar {
    width: 10rem;
    height: 10rem;
    border-radius: 50%;
    overflow: hidden;
    margin-right: 1rem;
	border: 1px solid #D7D7D7;
}

.tb-and-chat-group .area-chat .teacher-info-details .teacher-avatar .avatar-img {
    width: 100%;
    height: 100%;
}

.tb-and-chat-group .area-chat .teacher-info-details .teacher-avatar .avatar-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tb-and-chat-group .area-chat .teacher-name p {
    font-size: 1.6rem;
    font-weight: bold;
    color: #333;
	line-height: 1.6;
}

.tb-and-chat-group .area-chat .teacher-name .sub-name {
    font-size: 1.2rem;
    color: #999;
	line-height: 1.6;
}

.tb-and-chat-group .area-chat .teacher-appreciation a {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: #999;
    font-size: 1.5rem;
	line-height: 1.6;
}

.tb-and-chat-group .area-chat .teacher-appreciation img {
    width: 2.4rem;
    height: 2.6rem;
    margin-right: 0.5rem;
}

.tb-and-chat-group .area-chat .message-table {
    margin-top: 2rem;
}

.tb-and-chat-group .area-chat .message-table img {
    width: 100%;
    height: auto;
}

.tb-and-chat-group .area-chat .translation-tool-link {
    margin-top: 1.5rem;
    text-align: right;
}

.tb-and-chat-group .area-chat .translation-tool-link a {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    color: #00ACEE;
    font-size: 1.6rem;
	line-height: 1.6;
}

.tb-and-chat-group .area-chat .translation-tool-link img {
    width: 1.6rem;
    height: 1.6rem;
    margin-left: 0.5rem;
}

.tb-and-chat-group .area-chat #note-container .note-details {
	background-color: #f5f5f5;
	margin: 2rem;
}

.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo{
	height: calc(100% - 96px);
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo:before,
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo:after{
	top: 90px;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .flex_table{
	width: 100%;
	height: 100%;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .flex_table > tr > td{
	vertical-align: top;
	height: 100%;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .flex_table .flex_td_1_1{
	position: relative;
	height: 100%;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .flex_table .flex_tr_2{
	height: 40px;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .flex_table .flex_td_2_1{
	height: 40px;
}

.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo_wrap{
	position: relative;
	border: 1px solid #eee;
	height: 100%;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo_inner{
	height: 100%;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	background: #fff;
	overflow: scroll;
	overflow-x: hidden;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo_wrap .timeline_memo{
	padding: 1.5rem;
	border: none;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .form_memo{
	margin-top: 15px;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .form_memo table{
	width: 100%;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .form_memo table td:last-child{
	width: 130px;
	text-align: right;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .form_memo table td textarea{
	width: 100%;
	box-sizing: border-box;
	font-family: inherit;
	resize: none;
	max-height: 248px;
	height: auto;
	margin: 0;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .form_memo table td:last-child{
	width: 100px;
	text-align: right;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .form_memo table td .btn_style{
	height: 40px;
	min-height: 40px;
	min-width: 90px;
}

.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo_wrap{
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo li{
	position: relative;
	line-height: 1.5;
	border-top: 1px solid #eee;
	padding-bottom: 1.5rem;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo li:first-child{
	border-top: none;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo li .timeline_item{
	display: table;
	width: 100%;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo li .timeline_item .thumb,
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo li .timeline_item .data{
	display: table-cell;
	vertical-align: top;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo li .thumb{
	width: 60px;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo li .thumb img{
	display: block;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1px solid #E2E2E2;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.1);
	margin: 5px 15px 0 5px;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo li .data .name{
	display: inline-block;
	color: #aaa;
	font-size: 1.4rem;
	font-weight: normal;
	margin-right: 2rem;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo li .data .datetime{
	display: inline-block;
	color: #aaa;
	font-size: 1.4rem;
	line-height: 1;
	margin-right: 5px;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo li .data .desc{
	clear: both;
	display: block;
	font-size: 1.5rem;
	line-height: 1.5;
	margin-top: 5px;
}

/* mod1: type badge, datetime style, overlay, modify-memo-box */
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo li.timeline_item .type,
.tb-and-chat-group .area-chat .mod-content .type,
.tb-and-chat-group .area-chat #note-container .timeline_item .type,
.tb-and-chat-group .area-chat #note-container .mod-content .type {
	display: inline-block;
	background: #ff8a00;
	color: #fff;
	font-size: 1.4rem;
	padding: 0.4rem 1rem;
	border-radius: 0.6rem;
}
.tb-and-chat-group .area-chat .tab-content.ui_sub_panel_memo .timeline_memo li.timeline_item .thistory_style,
.tb-and-chat-group .area-chat #note-container .timeline_item .thistory_style {
	color: #BDBDBD;
	margin-bottom: .5rem;
}
.tb-and-chat-group .area-chat .ui_sub_panel_memo .overlay {
	display: none;
	width: 100%;
	height: 100%;
	right: 0;
	left: 0;
	top: 0;
	bottom: 0;
	position: absolute;
	z-index: 100;
}
.tb-and-chat-group .area-chat .timeline_memo li .data .name,
.tb-and-chat-group .area-chat .mod-content .name,
.tb-and-chat-group .area-chat #note-container .timeline_item .data .name,
.tb-and-chat-group .area-chat #note-container .mod-content .name {
	display: inline-block;
	color: #aaa;
	font-size: 1.4rem;
	font-weight: normal;
	margin-right: 1rem;
}
.tb-and-chat-group .area-chat .timeline_memo li .data .datetime,
.tb-and-chat-group .area-chat .mod-content .datetime,
.tb-and-chat-group .area-chat #note-container .timeline_item .data .datetime,
.tb-and-chat-group .area-chat #note-container .mod-content .datetime {
	display: inline-block;
	color: #aaa;
	font-size: 1.4rem;
	line-height: 1;
	margin-right: .5rem;
}
.tb-and-chat-group .area-chat .timeline_memo li .data .desc,
.tb-and-chat-group .area-chat .mod-content .desc,
.tb-and-chat-group .area-chat #note-container .timeline_item .data .desc,
.tb-and-chat-group .area-chat #note-container .mod-content .desc {
	clear: both;
	display: block;
	font-size: 1.5rem;
	line-height: 1.5;
	margin-top: .5rem;
}
.tb-and-chat-group .area-chat #modify-memo-box table {
	width: 100%;
}
.tb-and-chat-group .area-chat #modify-memo-box table tr td {
	padding-right: 1rem;
	vertical-align: middle;
}
.tb-and-chat-group .area-chat #modify-memo-box .mod-content {
	padding-right: 3rem;
}
.tb-and-chat-group .area-chat #modify-memo-box .mod-content textarea {
	width: 100%;
	min-height: 3.8rem;
	resize: none;
}
.tb-and-chat-group .area-chat #modify-memo-box .btn_wrap {
	text-align: right;
	width: 100%;
	padding: 0 1.5rem;
	box-sizing: border-box;
}
.tb-and-chat-group .area-chat #modify-memo-box .btn_wrap.btn_half .btn_style {
	min-width: 10rem;
	font-size: 1.5rem;
	height: 3.5rem;
	line-height: 3.5rem;
}
.tb-and-chat-group .area-chat #modify-memo-box .btn_wrap ul li {
	border-top: none;
	float: inherit;
	display: inline-block;
	padding: 0;
}
.tb-and-chat-group .area-chat #modify-memo-box .btn_wrap ul li + li {
	margin: 0 0 0 0.6rem;
}

.tb-and-chat-group .area-chat #note-container .menu-section ul {
	display: flex;
	justify-content: left;
	padding-bottom: 1.2rem;
	gap: 1rem;
}

.tb-and-chat-group .area-chat #note-container .menu-section ul li {
	display: inline;
}
.tb-and-chat-group .area-chat #note-container .td-memo-type{
	text-align: left;
	padding-bottom: 0.5rem;
}

.tb-and-chat-group .area-chat #note-container .td-memo-type select,
.tb-and-chat-group .area-chat #note-container #memo-type-select {
	font-size: 1.5rem;
	min-height: 4rem;
	padding: 0.5rem 1rem;
	min-width: 14rem;
	border: 1px solid #ccc;
	border-radius: 4px;
	background: #fff;
	color: #000;
}

.tb-and-chat-group .area-chat #note-container .form_memo table {
	border-collapse: separate;
	border-spacing: 0 0.3rem;
	width: 100%;
}
.tb-and-chat-group .area-chat #note-container .form_memo td {
	vertical-align: top;
}

.tb-and-chat-group .area-chat #note-container .form_memo textarea {
	width: 100%;
	box-sizing: border-box;
	resize: none;
	min-height: 1rem;
	font-size: 1.5rem;
}

.tb-and-chat-group .area-chat #note-container .form_memo p {
	margin: 0;
	font-size: 1.5rem;
}

.tb-and-chat-group .area-chat #note-container .form_memo tr:last-child td:last-child {
	text-align: right;
	width: 28%;
}

.tb-and-chat-group .area-chat #note-container .form_memo button {
	min-width: 9rem;
	height: 4rem;
	font-size: 1.5rem;
}

.tb-and-chat-group .area-chat #note-container .menu-section ul li a {
	border-bottom: 3px solid #b1b1b1;
	padding: 6px 39px;
	color: #000;
}	
.tb-and-chat-group .area-chat #note-container .menu-section ul li a.active {
	border-bottom: 3px solid #14a9b2;
	color: #14a9b2;
}
html:lang(pt-br) #note-container .menu-section ul li a {
	padding: 6px 10px;
}

.tb-and-chat-group .area-chat #note-container {
	padding: 3rem 2rem;
}

.tb-and-chat-group .area-chat #note-container .timeline_memo li{
	border: none;
	font-size: 1.5rem;
}
.tb-and-chat-group .area-chat #note-container .timeline_memo li.timeline_item {
	position: relative;
}

/* memo ellipsis (option-arrow) and option-list - match details_memo */
.tb-and-chat-group .area-chat #note-container .timeline_item .min-option {
	position: absolute;
	right: 0;
	top: 15px;
}
.tb-and-chat-group .area-chat #note-container .timeline_item .min-option > span.option-arrow {
	cursor: pointer;
	position: absolute;
	top: -1px;
	right: -5px;
	color: #6E6E6E;
	border: 1px solid #ccc;
	border-radius: 5px;
	padding: 4px;
}
.tb-and-chat-group .area-chat #note-container .timeline_item .min-option > span.option-arrow:after {
	content: '';
	background: url('../images/icon/menu_dot.png') no-repeat;
	background-size: contain;
	width: 12px;
	height: 12px;
	display: block;
	font-size: 2rem;
}
.tb-and-chat-group .area-chat #note-container .timeline_item .min-option .option-list {
	position: absolute;
	right: 20px;
	background-color: #fff;
	width: 100px;
	z-index: 200;
	display: none;
	border: 1px solid #424242;
	-webkit-box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.3);
}
.tb-and-chat-group .area-chat #note-container .timeline_item .min-option .option-list.on {
	display: block;
}
.tb-and-chat-group .area-chat #note-container .timeline_item .min-option .option-list li {
	padding: 7px 0px;
	color: #424242;
	font-size: 12px;
	border: 0;
	text-align: center;
}
.tb-and-chat-group .area-chat #note-container .timeline_item .min-option .option-list li:hover {
	background-color: #E9E9F0;
}
.tb-and-chat-group .area-chat #note-container .timeline_item .min-option .option-list li span {
	cursor: pointer;
	display: block;
}

.tb-and-chat-group .area-chat .teacher-info-container {
	padding: 0 2rem 2rem;
}

.tb-and-chat-group .area-chat .teacher_info {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 2rem;
}

.tb-and-chat-group .area-chat .teacher_info .teacher-avatar {
	width: 10rem;
	height: 10rem;
	border-radius: 50%;
	overflow: hidden;
	border: 1px solid #D7D7D7;
	margin-bottom: 1rem;
}

.tb-and-chat-group .area-chat .teacher_info .teacher-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.tb-and-chat-group .area-chat .teacher_info .teacher-name-roman {
	font-weight: 700;
	font-size: 1.6rem;
	line-height: 1.6;
	color: #333333;
}

.tb-and-chat-group .area-chat .teacher_info .teacher-name-native {
	font-weight: 400;
	font-size: 1.2rem;
	line-height: 1.6;
	color: #999999;
}

.tb-and-chat-group .area-chat .tip-section {
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: auto;
}

.tb-and-chat-group .area-chat .tip-section img {
	width: 2.4rem;
	height: 2.6rem;
	margin-right: 0.8rem;
}

.tb-and-chat-group .area-chat .tip-section span:not(.lesson_log_appreciation_button_text) {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	font-size: 1.5rem;
	line-height: 1.6;
	color: #999999;
}

/* -------- */

.tb-and-chat-group .area-chat #message-container {
	padding: 4rem 2rem;
}
.tb-and-chat-group .area-chat #message-container.message-empty {
	padding-top: 0;
}

.tb-and-chat-group .area-chat .message_content {
	padding: 4rem 2rem;
}

.tb-and-chat-group .area-chat .lesson-table-container {
	background: #fff;
	max-width: 36rem;
	color: #333;
	margin-bottom: 1.5rem;
}

.tb-and-chat-group .area-chat .lesson-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 1.4rem;
	table-layout: fixed;
}

.tb-and-chat-group .area-chat .lesson-table th,
.tb-and-chat-group .area-chat .lesson-table td {
	border: 1px solid #ccc;
	padding: 0.8rem .5rem;
	vertical-align: top;
}

.tb-and-chat-group .area-chat .lesson-table th {
	width: 10rem;
	background-color: #ededed;
	text-align: center;
	line-height: 1.5;
	border: 1px solid #bbbbbb;
	vertical-align: middle;
	font-weight: normal;
}

.tb-and-chat-group .area-chat .lesson-table td {
	line-height: 1.7;
	word-break: break-word;
	font-size: 1.5rem;
}

.tb-and-chat-group .area-chat .lesson-table a {
	color: #00acee;
	text-decoration: none;
	display: inline-block;
	margin-bottom: 0.4rem;
}

.tb-and-chat-group .area-chat .lesson-table a:hover {
	text-decoration: underline;
}

.tb-and-chat-group .area-chat tr.hr-sect {
	height: .8rem;
}

.tb-and-chat-group .area-chat .message_content .m-link{
	position: relative;
	padding-right: 2rem;
	width: max-content;
	margin: 0 0 0 auto;
}

.tb-and-chat-group .area-chat .message_content .m-link a{
	text-decoration: none;
}

.tb-and-chat-group .area-chat .message_content .m-link::before {
	content: url(https://nativecamp-public-web-production.s3.amazonaws.com/user/webroot/images/icon/ic_link.svg);
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
}

.tb-and-chat-group .area-chat .jumbotron{
	text-align: center; 
	padding-top:5rem; 
	padding-bottom:5rem;
}

.tb-and-chat-group .area-chat .message_no_history{
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	justify-content: space-between;
	height: auto;
	min-height: 62vh;
}
.tb-and-chat-group .area-chat .message_no_history p{
	line-height: 1.7;
	font-size: 1.5rem;
	position: relative;
}
.tb-and-chat-group .area-chat .message_no_history p span {
	position: absolute;
	top: 0;
	left: 0;
}

.tb-and-chat-group .area-chat #message-container .lesson_log_area .lesson_log_appreciation_button {
	color: #00acee;
}
.tb-and-chat-group .area-chat #message-container .lesson_log_area .lesson_log_appreciation_button.disabled {
	color: #999999;
	pointer-events: none;
}

.tb-and-chat-group .area-chat .lesson-info-header button.pop-player-link.play-recording:disabled {
	opacity: 0.3;
}

/* NJ-55495 END */

/* NJ-62762 START */
.page-inner-tb-and-chat.has-chat .lesson-info-header {
	display: flex;
	background: #000000;
	padding: .5rem 1.1rem;
	align-items: center;
	gap: 1.6rem;
}
.page-inner-tb-and-chat.has-chat .lesson-info-header button.pop-player-link {
	border: 1px solid #4A4A4A;
	border-radius: 2px;
	background: #292929;
	font-size: 1.4rem;
	font-weight: 700;
	color: #fff;
	padding: .5rem 1.6rem;
}
.page-inner-tb-and-chat.has-chat .lesson-info-header button.lesson_audio_fav_icon {
	border: none;
	background: none;
}
.page-inner-tb-and-chat.has-chat .lesson-info-header .lesson-info {
	color: #fff;
	font-weight: 700;
}
/* NJ-62762 END */
/* NJ-92200: Transcription Tab Styles START */
.transcription-loading {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 4rem 0;
}

/* Override size + colour for the transcription spinner only */
#transcription-spinner .ui-custom_spinner {
	width: 36px;
	height: 36px;
}
#transcription-spinner .ui-custom_spinner:after {
	width: 36px;
	height: 36px;
	border-width: 3px;
	border-color: #ccc;
	border-right-color: #ccc;
	border-bottom-color: #999;
}

.tb-and-chat-group .area-chat .transcription-content {
		display: flex;
		flex-direction: column;
		padding: 0 2rem 3rem 2rem;
	}

.tb-and-chat-group .area-chat .transcription-entry {
		position: relative;
		display: flex;
		flex-direction: column;
		gap: 6px;
		padding: 10px;
		border-radius: 8px;
		overflow: hidden;
		font-family: 'Noto Sans JP', sans-serif;
	}

	.tb-and-chat-group .area-chat .transcription-entry__menu-btn {
		position: absolute;
		top: 10px;
		right: 10px;
		display: none;
		align-items: center;
		justify-content: center;
		width: 28px;
		height: 28px;
		padding: 0;
		border: none;
		background: transparent;
		cursor: pointer;
		flex-shrink: 0;
		z-index: 1;
	}

	.tb-and-chat-group .area-chat .transcription-entry:hover .transcription-entry__menu-btn,
	.tb-and-chat-group .area-chat .transcription-entry.is-ctx-active .transcription-entry__menu-btn {
		display: inline-flex;
	}

	.transcription-entry.is-ctx-active .transcription-entry__menu-btn:hover {
		background: #0000000A;
		border-radius: 50%;
	}

	/* NJ-99993 — gap is 0 BY REQUEST (Moriya, 2026-08-07), overriding the design's
	 * `.segment_header{gap:var(--space-sm-plus)}` (10px).
	 *
	 * ⚠️ The visible space between the badge and the time is NOT this property. `.transcription-timestamp`
	 * below carries `padding: 4px 8px`, so at gap:10px the perceived separation was 18px — which is what
	 * looked too wide. Zeroing the gap leaves the timestamp's own 8px of left padding as the spacing, i.e.
	 * ~8px visible.
	 *
	 * That padding cannot simply be removed: NJ-97932's playing indicator fills the timestamp element, and
	 * without padding the highlight becomes a cramped rectangle behind bare text. So it is the padding, not
	 * the gap, that is the next lever if this needs to be tighter still.
	 *
	 * Only the badge and the timestamp live in this header — the "..." menu button is a SIBLING of it (see
	 * transcript.js:533), so nothing else is affected by this. */
	.tb-and-chat-group .area-chat .transcription-entry__header {
		display: flex;
		align-items: center;
		gap: 0;
		height: 30px;
		overflow: hidden;
		flex-shrink: 0;
		width: 100%;
	}

	.tb-and-chat-group .area-chat .transcription-time-badge {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex-shrink: 0;
		background-color: #f5f5f5;
		border-radius: 9999px;
		padding: 4px 6px;
		font-size: 1.2rem;
		font-weight: 500;
		line-height: 1.3;
		color: #6b6b6b;
		white-space: nowrap;
	}

	/* NJ-99993: the speaker label becomes the coloured pill and moves BEFORE the timestamp, per
	 * Yamazaki's design. This inverts the previous treatment, where the timestamp was the grey pill and
	 * the speaker label was plain text — so both rules change together and neither makes sense alone.
	 * Markup order is set in transcript.js (~line 515).
	 *
	 * Values are the design's `.time_badge` (UI-Design/css/review.css:232-237) — 36×22 at radius 4px, NOT
	 * a pill. The pill shape was my own reading of the comps and is the main thing Moriya flagged.
	 *
	 * min-width rather than a fixed width: 36px is exactly right for the two-character 講師 / 生徒 labels,
	 * but these strings are hardcoded Japanese with no .po entry, so if anyone ever localises them a fixed
	 * width would clip. Identical rendering today, no clipping later. */
	.tb-and-chat-group .area-chat .transcription-speaker-label {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex-shrink: 0;
		min-width: 36px;
		height: 22px;
		padding: 0 4px;
		font-size: 1.3rem;
		/* 700 BY REQUEST (Moriya, 2026-08-07). The design's `.time_badge p` specifies 500
		 * (--caption-lg-medium); bold was asked for after seeing it on screen. Deliberate override — do not
		 * "restore" this to 500 on a future design sync without checking with him. */
		font-weight: 700;
		line-height: 1.3;
		white-space: nowrap;
		border-radius: 4px;
	}

	/* All four values come from the design export, as a matched pair per speaker:
	 *   講師  bg #dfebfa (Blue/100)   text #1960b7 (Blue/600)
	 *   生徒  bg #fdeedd (Orange/100) text #c7710c (Orange/600)
	 *
	 * These are SOLID fills. An earlier version derived the backgrounds as 12% alpha tints of the text
	 * colours, reasoning that it kept them in step with NJ-97932's playing indicator. That was my
	 * invention, not the design: rgba(25,96,183,.12) over white is ~#e8eef7, noticeably cooler and
	 * lighter than #dfebfa, which is why the badges read as washed out next to the comp.
	 *
	 * The transcript panel follows NJ-97932's Figma values and is deliberately a SEPARATE system from the
	 * AI review's V2 tokens — the design says so explicitly (review.css:249: 「別系統なので混ぜない」).
	 * Do not swap these for V2 semantic tokens.
	 *
	 * The modifier class is derived from _normalizeSpeaker() rather than the label text, so it survives
	 * localization — string-matching 講師 would have silently lost the colour in every other language
	 * (see transcript.js ~line 515). */
	.tb-and-chat-group .area-chat .transcription-speaker-label--teacher {
		background-color: #dfebfa;
		color: #1960b7;
	}

	.tb-and-chat-group .area-chat .transcription-speaker-label--student {
		background-color: #fdeedd;
		color: #c7710c;
	}

	/* NJ-97932: M:SS timestamp in the segment header (paired with speaker label).
	 *
	 * NJ-99993: reads as plain text now — the visible pill treatment moved to the speaker label above.
	 * The radius and padding are KEPT with a transparent background, deliberately: NJ-97932's
	 * playing indicator (.is-highlighted, ~90 lines below) fills this element to mark the currently
	 * playing segment. Dropping padding/radius outright would have turned that shipped indicator into a
	 * cramped orange rectangle behind bare text. Transparent + padding looks like plain text until the
	 * highlight fills it, so both the new design and the existing feature hold.
	 *
	 * Type and colour match the design's `.segment_time`: 13px / 500 / #999999 (Gray/400). It was #6b6b6b
	 * (Gray/600) — a step too dark, which made the timestamp compete with the badge beside it instead of
	 * receding behind it. */
	.tb-and-chat-group .area-chat .transcription-timestamp {
		flex-shrink: 0;
		font-size: 1.3rem;
		/* 700 BY REQUEST (Moriya, 2026-08-07), matching the speaker badge beside it. The design specifies
		 * 500 for `.segment_time`; this is a deliberate override, same as the badge's weight. */
		font-weight: 700;
		line-height: 1.3;
		color: #999999;
		white-space: nowrap;
		background-color: transparent;
		border-radius: 9999px;
		padding: 4px 8px;
	}

	.tb-and-chat-group .area-chat .transcription-dialogue {
		flex-shrink: 0;
		width: 100%;
		margin: 0;
		font-size: 1.6rem;
		font-weight: 700;
		line-height: 1.6;
		color: #6b6b6b;
	}

	.tb-and-chat-group .area-chat .transcription-dialogue--playing {
		color: #f1890e;
	}

	.tb-and-chat-group .area-chat .transcription-see-original {
		display: inline-flex;
		align-items: center;
		gap: 4px;
		margin-top: 4px;
		border: none;
		background: transparent;
		padding: 0;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.3rem;
		font-weight: 500;
		line-height: 1.3;
		color: #F1890E;
		cursor: pointer;
	}

	.tb-and-chat-group .area-chat .transcription-see-original--active {
		width: max-content;
		height: 36px;
		padding: 6px 12px;
		border: 1px solid #f1890e;
		border-radius: 9999px;
		background-color: #fff;
		color: #f1890e;
		text-decoration: none;
		gap: 6px;
	}

	.tb-and-chat-group .area-chat .transcription-see-original--active:hover {
		background-color: rgba(241, 137, 14, 0.06);
		color: #f1890e;
	}

	.tb-and-chat-group .area-chat .transcription-see-original__icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 16px;
		height: 16px;
		flex-shrink: 0;
	}

	.tb-and-chat-group .area-chat .transcription-empty {
		padding: 4rem 2rem;
		text-align: center;
		color: #666;
	}

	/* NJ-97932: No Results State */
	.transcript-no-results {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 6px;
		padding: 8px 10px;
		background-color: #fff;
		width: 100%;
		box-sizing: border-box;
		text-align: center;
	}

	.transcript-no-results__title {
		margin: 0;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.6rem;
		font-weight: 700;
		line-height: 1.6;
		color: #191919;
		width: 100%;
	}

	.transcript-no-results__body {
		margin: 0;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.4rem;
		font-weight: 400;
		line-height: 1.6;
		color: #6b6b6b;
		width: 100%;
	}

	/* Icon for transcription tab - reuse note icon temporarily */
	.action_list .action_list-item.active .inner > i.icon_transcription {
		background-image: url('https://nativecamp-public-web-production.s3.amazonaws.com/user/webroot/images/textbook/icon/icon_transcript_on.svg');
	}
	.action_list .action_list-item .inner > i.icon_transcription {
		background-image: url('https://nativecamp-public-web-production.s3.amazonaws.com/user/webroot/images/textbook/icon/icon_transcript.svg');
	}

	/* NJ-97932: Transcription Modal Header */
	.transcript-modal-header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 1rem 2rem;
		background-color: #fff;
	}

	.transcript-modal-title {
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 2rem;
		font-weight: 700;
		line-height: 1.5;
		color: #191919;
		margin: 0;
	}

	.transcript-btn-copy-all {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		height: 40px;
		padding: 0 10px;
		border-radius: 9999px;
		border: none;
		background: transparent;
		cursor: pointer;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.4rem;
		font-weight: 700;
		line-height: 1.6;
		color: #191919;
		white-space: nowrap;
		transition: background-color 0.15s ease;
	}

	.transcript-btn-copy-all:hover {
		background-color: rgba(0, 0, 0, 0.06);
	}

	.transcript-btn-copy-all__icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 24px;
		height: 24px;
		flex-shrink: 0;
	}

	/* NJ-97932: Transcript Search Bar */
	.transcript-search-bar {
		background-color: #fff;
		padding: 12px 20px;
		width: 100%;
		box-sizing: border-box;
	}

	.transcript-search-field {
		display: flex;
		align-items: center;
		gap: 6px;
		height: 40px;
		padding: 4px 8px;
		background-color: #f5f5f5;
		border-radius: 9999px;
		width: 100%;
		box-sizing: border-box;
		cursor: text;
	}

	.transcript-search-field__icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 24px;
		height: 24px;
		flex-shrink: 0;
		color: #6b6b6b;
	}

	#transcript-search-bar .transcript-search-field__input {
		flex: 1;
		border: none !important;
		background: transparent !important;
		outline: none !important;
		box-shadow: none !important;
		-webkit-appearance: none;
		appearance: none;
		padding: 0 !important;
		margin: 0 !important;
		border-radius: 0 !important;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.4rem;
		font-weight: 400;
		line-height: 1.6;
		color: #191919;
		min-width: 0;
		width: 100%;
	}

	#transcript-search-bar .transcript-search-field__input::placeholder {
		color: #6b6b6b;
	}

	.transcript-search-field__clear {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 32px;
		height: 32px;
		flex-shrink: 0;
		border: none;
		background: transparent;
		padding: 0;
		cursor: pointer;
		color: #6b6b6b;
		border-radius: 50%;
		transition: background-color 0.15s ease;
	}

	.transcript-search-field__clear:hover {
		background-color: rgba(0, 0, 0, 0.06);
	}

	/* NJ-97932: Offline Banner */
	.transcript-offline-banner {
		width: 100%;
		box-sizing: border-box;
		padding: 8px 20px;
	}

	.transcript-offline-banner__content {
		display: flex;
		align-items: center;
		gap: 12px;
		padding: 16px;
		background-color: #fcfaf3;
		border: 1px solid #f6d01b;
		border-radius: 8px;
		box-sizing: border-box;
	}

	.transcript-offline-banner__icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 20px;
		height: 20px;
		flex-shrink: 0;
		color: #74660a;
	}

	.transcript-offline-banner__text {
		flex: 1;
		min-width: 0;
		margin: 0;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.3rem;
		font-weight: 500;
		line-height: 1.3;
		color: #74660a;
		word-break: break-word;
	}

	.transcript-offline-banner__close {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 3.2rem;
		height: 3.2rem;
		flex-shrink: 0;
		border: none;
		background: transparent;
		padding: 0;
		cursor: pointer;
		color: #74660a;
		border-radius: 50%;
		transition: background-color 0.15s ease;
	}

	.transcript-offline-banner__close:hover {
		background-color: rgba(116, 102, 10, 0.08);
	}

	/* NJ-97932: Transcript Track Row */
	.transcript-track-row, .transcript-search-result {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 8px 10px 0 10px;
		background-color: #fff;
		width: 100%;
		box-sizing: border-box;
	}

	.transcript-track-row__label, .transcript-search-result__label {
		flex: 1;
		margin: 0;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.6rem;
		font-weight: 700;
		line-height: 1.6;
		color: #191919;
	}

	/* Mobile responsive */
	@media (max-width: 768px) {
		.tb-and-chat-group .area-chat .transcription-dialogue {
			font-size: 1.4rem;
		}

		.transcript-modal-title {
			font-size: 1.8rem;
		}
	}
	.action_list .action_list-item p {
		white-space: nowrap;
	}

	/* NJ-97932: Segment Context Menu */
	.transcript-context-menu {
		position: fixed;
		/* NJ-97932 fix: must sit ABOVE .transcript-toast-wrap (z-index 10000) —
		   the "音声と同期" button used to overlap the open context menu. */
		z-index: 10001;
		display: flex;
		flex-direction: column;
		width: 220px;
		background-color: #fff;
		border-radius: 16px;
		padding: 10px;
		box-shadow: 0px 8px 16px -4px rgba(0, 0, 0, 0.2), 0px 4px 12px 0px rgba(0, 0, 0, 0.2);
		overflow: hidden;
	}

	.transcript-context-menu__item {
		display: flex;
		align-items: center;
		gap: 12px;
		padding: 12px;
		background: transparent;
		border: none;
		width: 100%;
		text-align: left;
		cursor: pointer;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.6rem;
		font-weight: 400;
		line-height: 1.6;
		color: #191919;
		border-radius: 8px;
		transition: background-color 0.15s ease;
	}

	.transcript-context-menu__item:hover {
		background-color: rgba(0, 0, 0, 0.06);
	}

	.transcript-context-menu__icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 24px;
		height: 24px;
		flex-shrink: 0;
		color: #191919;
	}

	.tb-and-chat-group .area-chat .transcription-entry {
		cursor: pointer;
	}

	.tb-and-chat-group .area-chat .transcription-entry:hover,
	.tb-and-chat-group .area-chat .transcription-entry.is-ctx-active {
		background-color: #f5f5f5;
	}

	/* NJ-97932: Audio-synced highlight (FR-001) — no fill, no border; dark bold text only */
	.tb-and-chat-group .area-chat .transcription-entry.is-highlighted .transcription-dialogue {
		color: #191919;
		font-weight: 700;
	}

	/* NJ-97932 fix: while segment repeat is active the text must stay orange even
	   when the playback highlight (.is-highlighted) is on the same entry — the
	   more specific rule above used to win intermittently, making the orange
	   flicker off during the loop. */
	.tb-and-chat-group .area-chat .transcription-entry .transcription-dialogue.transcription-dialogue--playing,
	.tb-and-chat-group .area-chat .transcription-entry.is-highlighted .transcription-dialogue.transcription-dialogue--playing {
		color: #f1890e;
	}

	/* NJ-97932: YouTube-style playing indicator — tint the timestamp pill of the
	   currently-playing segment with the NC theme orange (subtle fill + text). */
	.tb-and-chat-group .area-chat .transcription-entry.is-highlighted .transcription-timestamp {
		background-color: rgba(241, 137, 14, 0.14);
		color: #f1890e;
	}

	/* NJ-97932: Sync Audio Button */
	.transcript-btn-sync-audio {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding: 10px 16px;
		background-color: #191919;
		color: #fff;
		border: none;
		border-radius: 9999px;
		box-shadow: 0px 4px 6px -2px rgba(0, 0, 0, 0.1), 0px 2px 6px 0px rgba(0, 0, 0, 0.1);
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.4rem;
		font-weight: 700;
		line-height: 1;
		letter-spacing: 0.07px;
		cursor: pointer;
		white-space: nowrap;
		max-width: 100%;
		opacity: 0;
		transition: opacity 0.2s ease, transform 0.2s ease;
		transform: translateY(12px);
		pointer-events: none;
	}

	.transcript-btn-sync-audio.is-visible {
		opacity: 1;
		transform: translateY(0);
		pointer-events: auto;
	}

	.transcript-btn-sync-audio:hover {
		background-color: #2e2e2e;
	}

	/* NJ-97932: Copy Toast */
	.transcript-toast-wrap {
		position: sticky;
		bottom: 0;
		width: 100%;
		box-sizing: border-box;
		padding: 0 2rem 16px;
		display: flex;
		justify-content: center;
		z-index: 10000;
		pointer-events: none;
	}

	.transcript-toast {
		display: inline-flex;
		align-items: center;
		gap: 12px;
		padding: 16px;
		background-color: rgba(0, 0, 0, 0.8);
		border-radius: 16px;
		box-shadow: 0px 5px 7.5px rgba(0, 0, 0, 0.15);
		max-width: 100%;
		width: 90%;
		opacity: 0;
		transition: opacity 0.2s ease, transform 0.2s ease;
		transform: translateY(12px);
		pointer-events: none;
	}

	.transcript-toast.is-visible {
		opacity: 1;
		transform: translateY(0);
		pointer-events: none;
	}

	.transcript-toast__icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 24px;
		height: 24px;
		flex-shrink: 0;
		color: #fff;
	}

	.transcript-toast__text {
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 1.3rem;
		font-weight: 500;
		line-height: 1.3;
		color: #fff;
		margin: 0;
	}

	/* NJ-97932: Error Toast variant */
	.transcript-toast--error {
		background-color: #fff9f9;
		border: 1px solid #ff3535;
		box-shadow: 0px 5px 7.5px rgba(0, 0, 0, 0.15);
	}

	.transcript-toast--error .transcript-toast__icon {
		color: #d92929;
	}

	.transcript-toast--error .transcript-toast__text {
		color: #d92929;
	}

	/* NJ-92200: Transcription Tab Styles END */