@charset "utf-8";
/* 공통 */
.scroller::-webkit-scrollbar {height: 7px;}
.scroller::-webkit-scrollbar-thumb {background:#E6EAED;border-radius:7px}
.scroller::-webkit-scrollbar-track {background:transparent}

.pre_area pre{overflow-y: hidden;background-color: #E6EAED;line-height: 20px;}
.pre_area.scroller pre::-webkit-scrollbar {height: 7px;}
.pre_area.scroller pre::-webkit-scrollbar-thumb{background:#B2B4B8;border-radius:7px}
/* 공통 */

.dev_guide_wrap{padding: 40px 0;background-color: #fff;}
.dev_guide_wrap .title_group{margin-top: 40px;}
.dev_guide_wrap .title_group .title{margin-top: 16px;font-family:'OneShinhan';font-size: 32px;font-weight: 700;line-height: 40px;}
.dev_guide_wrap .title_group p{margin-top: 16px;font-size: 18px;line-height: 24px;}
.dev_guide_wrap .dev_menu{display: flex;justify-content: center;margin-top: 48px;}
.dev_guide_wrap .dev_menu .btn_dev_menu{flex: 1;height: 48px;padding: 12px 0;border-top: 1px solid #E6EAED;border-right:1px solid #E6EAED;border-left:1px solid #E6EAED;border-bottom:1px solid #202225;background-color: #f9fafb;font-size: 18px;color: #B2B4B8;line-height: 24px;}
.dev_guide_wrap .dev_menu .btn_dev_menu.active{border-top:1px solid #202225;border-right:1px solid #202225;border-left:1px solid #202225 !important;border-bottom: #fff;background-color: #fff;font-weight: 700;color: #202225;}
.dev_guide_wrap .dev_contents{margin-top: 35px;}

.dev_contents .guide_cont_box{margin-bottom: 48px;}
.dev_contents .guide_cont_box:last-child{margin-bottom: 0;}
.dev_contents .guide_cont_box .h1_title{margin-bottom: 24px;;font-size: 24px;font-weight: 700;line-height: 32px;}
.dev_contents .guide_cont_box .desc{margin-bottom: 24px;}
.dev_contents .guide_cont_box .desc .h2_title{margin-bottom: 8px;;font-size: 20px;font-weight: 700;line-height: 28px;}
.dev_contents .guide_cont_box .desc p{font-size: 16px;line-height: 24px;}
.dev_contents .guide_cont_box .desc .txt_bullet{position: relative;margin-bottom: 8px;;padding-left: 10px;font-weight: 500;}
.dev_contents .guide_cont_box .desc .txt_bullet::before{content: '';position: absolute;top:50%;left: 0;width: 4px;height: 4px;border-radius: 2px;background-color: #202225;transform: translateY(-50%);}
.dev_contents .guide_cont_box .pre_area{overflow-x: auto;padding: 20px 20px 4px 20px;border-radius: 4px;background-color: #E6EAED;}

.guide_cont_box .board_area{overflow-x: auto;padding: 16px 0 4px;}
.guide_cont_box .board_area .board_list{max-width: 1224px;min-width: 1224px;border-top:0}
.guide_cont_box .board_area .board_list .th_head{display:block;border-top: 1px solid #202225;background-color:#F9FAFB;}
.guide_cont_box .board_area .board_list .th_head div{display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;}
.guide_cont_box .board_area .board_list .th_head div span{padding: 16px 0;border-right: 1px solid #dbdee1;border-bottom: 1px solid #dbdee1;font-size:16px;font-weight:700;line-height:24px;letter-spacing:-.09px;text-align:center;}
.guide_cont_box .board_area .board_list .th_head div span:last-child{border-right: none;}
.guide_cont_box .board_area .board_list .th_head div .head_parameter{flex-shrink:0;width:240px;}
.guide_cont_box .board_area .board_list .th_head div .head_value{flex:1;}
.guide_cont_box .board_area .board_list li{padding:0;border-bottom: none;}
.guide_cont_box .board_area .board_list li div span{font-size: 16px;line-height: 24px;text-align:left;}
.guide_cont_box .board_area .board_list li div{display:flex;flex-direction:unset;justify-content:space-between;flex-wrap:nowrap;}
.guide_cont_box .board_area .board_list li div .col_parameter{overflow:hidden;width:240px;padding:16px;border-right: 1px solid #dbdee1;border-bottom: 1px solid #dbdee1;letter-spacing:-.09px;text-align:left;}
.guide_cont_box .board_area .board_list li div .col_value{flex:1;margin-bottom: 0;;padding:16px;border-bottom: 1px solid #dbdee1;line-height:24px;letter-spacing:-.09px;}
.guide_cont_box .board_area .board_list li .txt_bold{font-weight: 700;}
.guide_cont_box .board_area .board_list li .sub_desc{font-size: 13px;color: #6f7277;line-height: 16px;}

@media screen and (min-width:1024px){
    .dev_guide_wrap .dev_top_area{display: flex;flex-direction: row-reverse;justify-content: space-between;align-items: end;}
    .dev_guide_wrap .dev_top_area .sel_box{width: 240px;}
    .dev_guide_wrap .title_group .title{font-size: 40px;}
    .dev_guide_wrap .dev_menu{justify-content: start;border-bottom: 1px solid #202225;}
    .dev_guide_wrap .dev_menu .btn_dev_menu{flex: none;padding: 12px 32px;margin-bottom: -1px;border-left: none;}
    .dev_guide_wrap .dev_menu .btn_dev_menu:first-child{border-left: 1px solid #E6EAED;}

    .dev_contents .guide_cont_box .h1_title{margin-bottom: 28px;;font-size: 32px;line-height: 40px;}
    .dev_contents .guide_cont_box .desc h3{font-size: 24px;line-height: 32px;}
}