@charset "utf-8";



/* --------------------------------------------------------- common ------------------------------------------------------------------ */
/* container */


/* item box */
.box-style1 {border: 1px solid #dbdad9; padding: 15px 20px;}
/* --------------------------------------------------------- //common ------------------------------------------------------------------ */



/* --------------------------------------------------------- Introduction of the Association ------------------------------------------------------------------ */
/* Greeting */
.greeting {overflow: hidden;}
.greeting .photo {float: left; margin-right: 20px;}
.greeting .title {font-size: 40px; line-height: normal; color: #444141; margin-top: 55px;}
.greeting .sub-title {font-size: 24px; line-height: 36px;; color: #878686;}
.greeting p {font-size: 16px; line-height: 24px; margin: 30px 0;}
.greeting p.both {clear: both; padding-top: 20px;}
.greeting p.ceo * {display: inline-block; vertical-align: bottom;}
.greeting p.ceo img {margin-left: 10px;}


/* New 인사말 */
.greeting2 {
	display: table; width: 100%; table-layout: fixed;
	box-sizing: border-box;
	margin: 30px 0 15px;
}
.greeting2 .photo-area,
.greeting2 .text-area {display: table-cell; vertical-align: top;}
.greeting2 .photo-area {width: 220px;}
.greeting2 .photo-area img {width: 190px;}
.greeting2 .t-head {border-bottom: 1px solid #000000; padding-bottom: 25px; margin-bottom: 25px;}
.greeting2 .t-head p {font-size: 24px; line-height: 36px; color: #1a1515; font-weight: bold;}
.greeting2 .t-body p {font-size: 16px; line-height: 24px; color: #444141; margin-top: 25px; word-break: keep-all;}
.greeting2 .t-body p:first-child {margin-top: 0;}
.greeting2 .t-body p .sign {font-size: 18px; color: #444141;}



/* General Overview */
ul.tasks-list {overflow: hidden; width: 840px;}
ul.tasks-list li {
    float: left; width: 320px; height: 60px; padding: 0 65px 0 15px; text-align: left;
    border: 1px solid #e5e6e6; background: #fff; margin: 10px 10px 0 0;
}
ul.tasks-list li:nth-child(1) {background: url("../../images/eng/sub/overview/tasks_01.png") no-repeat right 10px center;}
ul.tasks-list li:nth-child(2) {background: url("../../images/eng/sub/overview/tasks_02.png") no-repeat right 10px center;}
ul.tasks-list li:nth-child(3) {background: url("../../images/eng/sub/overview/tasks_03.png") no-repeat right 10px center;}
ul.tasks-list li:nth-child(4) {background: url("../../images/eng/sub/overview/tasks_04.png") no-repeat right 10px center;}
ul.tasks-list li:nth-child(5) {background: url("../../images/eng/sub/overview/tasks_05.png") no-repeat right 10px center;}
ul.tasks-list li:nth-child(6) {background: url("../../images/eng/sub/overview/tasks_06.png") no-repeat right 10px center;}
ul.tasks-list li:nth-child(7) {background: url("../../images/eng/sub/overview/tasks_07.png") no-repeat right 10px center;}
ul.tasks-list li:nth-child(8) {background: url("../../images/eng/sub/overview/tasks_08.png") no-repeat right 10px center;}
ul.tasks-list li:nth-child(9) {background: url("../../images/eng/sub/overview/tasks_09.png") no-repeat right 10px center;}
ul.tasks-list li:nth-child(10) {background: url("../../images/eng/sub/overview/tasks_10.png") no-repeat right 10px center;}
ul.tasks-list li:nth-child(11) {background: url("../../images/eng/sub/overview/tasks_11.png") no-repeat right 10px center;}

ul.tasks-list li p {
    display: table-cell; vertical-align: middle; width: 320px; height: 60px;
    font-size: 14px; line-height: 18px; color: #252828;
}



/* history */
.history > ul {background: url("../../images/eng/sub/history/line_bg.jpg") repeat-y left 66px top; padding: 15px 0 ;}
.history > ul > li {display: table; width: 100%; margin-top: 10px;}
.history > ul > li:first-child {margin-top: 0;}
.history > ul > li > .l-area,
.history > ul > li > .r-area {display: table-cell; vertical-align: middle;}

.history .l-area {width: 90px;}
.history .l-area img {display: inline-block; vertical-align: middle;}

.history .r-area {border: 1px solid #cdcdcd; padding: 10px 15px; position: relative;}
.history .r-area::after {
    content: url("../../images/eng/sub/history/triangle.png");
    position: absolute; top: 46%; top: calc(50% - 7px); left: -12px;
    width: 12px; height: 13px;
}



/* Organization Chart */
.organization .org-chart {border: 1px solid #dbdad9;}
.organization .org-chart img {display: inline-block;}

ul.org-list {overflow: hidden; width: 830px;}
ul.org-list li {float: left; border: 1px solid #dbdad9; padding: 0 15px; margin: 10px 14px 0 0;}
ul.org-list li p {
    display: table-cell; vertical-align: middle; width: 365px; height: 48px;
    font-size: 14px; color: #444141;
}


/* Love Sharing Volunteer Group */
.volunteer .top {border-bottom: 1px solid #c3c8d1;}
.volunteer .top img {display: inline-block;}



/* Promotion Offices */
.pr-office .info {display: table; width: 100%; margin-bottom: 30px;}
.pr-office .info .l-area,
.pr-office .info .r-area {display: table-cell; vertical-align: top;}

.pr-office .info .l-area {width: 111px; padding-right: 30px;}
.pr-office .info .r-area {/*padding-left: 30px;*/}

.pr-office .info img.photo {width: 109px; border: 1px solid #dfe3e0;}
.pr-office .info .title {font-size: 24px; color: #717374; margin-bottom: 10px;}
.pr-office .info .type-body {font-size: 15px; color: #717374;}

.pr-office .map-info {
    background: #fff; border: 1px solid #d3d4d5; border-top: none;
    padding: 45px 40px; display: table; width: 92%; width: calc(100% - 82px);
}

.pr-office .map-info .l-area,
.pr-office .map-info .r-area {display: table-cell; vertical-align: middle;}

.pr-office .map-info .l-area {width: 240px;}
.pr-office .map-info .r-area {padding-left: 45px;}

.pr-office .map-info .title {font-size: 24px; line-height: 30px; font-weight: normal; color: #707376;}
.pr-office .map-info .title span {display: inline-block; vertical-align: middle; color: #707376;}
.pr-office .map-info .title span.icon {margin-left: 40px;}

.pr-office .map-info .list-style1 li {padding: 2px 0 ; padding-left: 8px; background-position: left 12px;}
.pr-office .map-info .list-style1 li .btn {top: -10px;}
/* --------------------------------------------------------- //Introduction of the Association ------------------------------------------------------------------ */



/* --------------------------------------------------------- About Jeju ------------------------------------------------------------------ */
/* traditions of jeju */
.tr-jeju .article {overflow: hidden; margin-top: 10px;}
.tr-jeju .article:first-child {margin-top: 0;}
.tr-jeju .article .photo {float: left; margin-right: 15px;}
.tr-jeju .article .photo img {display: inline-block;}

.tr-jeju .article .text-wrap {}
.tr-jeju .article .text-wrap .title {font-size: 16px; color: #3d3b3b; margin-bottom: 10px;}
/* --------------------------------------------------------- //About Jeju ------------------------------------------------------------------ */



/* --------------------------------------------------------- popup ------------------------------------------------------------------ */
/* popup common */
.win-popup {padding: 20px;}


/* 임원명단 팝업 */
.win-popup .member article .title {font-size: 16px; font-weight: 700; border-bottom: 1px dashed #bababa; padding-bottom: 10px; margin-bottom: 20px;}

.win-popup .member article .info {display: table; width: 100%;}
.win-popup .member article .info .photo,
.win-popup .member article .info ul {display: table-cell; vertical-align: top;}

.win-popup .member article .info .photo {width: 108px;}
.win-popup .member article .info .photo img {width: 100%;}

.win-popup .member article .info ul {padding-left: 20px;}
.win-popup .member article .info ul li dl {display: table; width: 100%;}
.win-popup .member article .info ul li dl dt,
.win-popup .member article .info ul li dl dd {display: table-cell; vertical-align: top;}

.win-popup .member article .info ul li dl dt {width: 88px;}
.win-popup .member article .info ul.list-style1 li {font-size: 14px; padding: 2px 0 2px 8px; background-position: left top 12px;}

.win-popup .member article .info dl.addr dd {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2; /* 출력할 라인수 */
    line-height: 20px;
    height: 40px; /* (line-height * 출력할 라인수) */
}
/* --------------------------------------------------------- //popup ------------------------------------------------------------------ */