@charset "utf-8";

.mainContW {position:relative; padding:0 3.5%; box-sizing:border-box;}

.mainCont01 {padding:52px 0 50px 0; background:url('../images/mobile/main/bgMain033.jpg') no-repeat center; background-size:cover;}
.mainCont01 .mainContW > ul {overflow:hidden; padding:0; margin:0; list-style:non margin-top:10px;}
.mainCont01 .mainContW > ul > li {float:left; position:relative; overflow:hidden; width:25%; height:235px; padding:5px 19px; background:url('../images/mobile/main/bgPattern.png') repeat; border:1px solid #ffffff; border-left:0; border-collapse:collapse; box-sizing:border-box; transition:0.3s; -webkit-transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s;}
.mainCont01 .mainContW > ul > li p {font-weight:900;}
.mainCont01 .mainContW > ul > li:hover {background:#de4a63;}
.mainCont01 .mainContW > ul > li:hover h5 {color:#ffffff;}
.mainCont01 .mainContW > ul > li:hover h5:after {width:100%; margin-top:5px; background:#e56e82;}
.mainCont01 .mainContW > ul > li:hover p, .mainCont01 .mainContW > ul > li:hover img {display:none;}
.mainCont01 .mainContW > ul > li h5 {line-height:100%; margin:15px 0 8px 0; font-size:2.4rem; font-size:24px; color:#1a1a1a;}
.mainCont01 .mainContW > ul > li h5:after {content:''; display:block; width:30px; height:1px; margin-top:16px; background:#de4a63;}
.mainCont01 .mainContW > ul > li p {line-height:117%; margin:0; color:#333333;}
.mainCont01 .mainContW > ul > li.bgWrap {display:table; background:url('../images/mobile/main/bgCont0101.jpg') no-repeat center; background-size:cover; border:0;}
.mainCont01 .mainContW > ul > li.bgWrap.bgImg02{background-image:url('../images/mobile/main/bgCont0104.jpg');}
.mainCont01 .mainContW > ul > li.bgWrap.bgImg03{background-image:url('../images/mobile/main/bgCont0103.jpg'); color:#e5e5e5;}
.mainCont01 .mainContW > ul > li em {display:table-cell; line-height:100%; font-size:2.4rem; font-size:24px; text-align:center; vertical-align:middle;}
.mainCont01 .mainContW > ul > li span.txt {display:block; color:#e5e5e5;}
.mainCont01 .mainContW > ul > li img {position:absolute; bottom:16px; width:23%;}
.mainCont01 .mainContW > ul > li:nth-child(9) {margin-left:25%; border-right:1px solid #ffffff; }
.mainCont01 .mainContW > ul > li ul {display:none; padding:0; list-style:none;}
.mainCont01 .mainContW > ul > li ul.other {padding:0; list-style:none;}
.mainCont01 .mainContW > ul > li:hover ul {display:block;}
.mainCont01 .mainContW > ul > li ul li {position:relative; line-height:100%; padding:5px 0 5px 19px;}
.mainCont01 .mainContW > ul > li ul li:before {content:''; position:absolute; top:50%; left:0; width:4px; height:4px; margin-top:-2px; border-radius:2px; background:#ffffff;}
.mainCont01 .mainContW > ul > li ul li a {padding:4px 0; font-weight:600; color:#cccccc;}
.mainCont01 .mainContW > ul > li ul li a:hover {color:#f9f2a4;}

.mainCont02 {padding:20px 0 27px; background:#f6f6f6;}
.mainCont02 .article01 {position:relative; width:50%;}
.mainCont02 .article01 .slider {margin:0; padding:0; list-style:none;}
.mainCont02 .article01 .slider li img {width:100%; vertical-align:top;}
.mainCont02 .article02 {position:absolute; overflow:hidden; top:0; right:0; width:50%; height:100%;}
.mainCont02 .article02 .rateW:first-child {border-right:0;}
.mainCont02 .article02 .rateW {float:left; position:relative; width:50%; height:100%; padding:20px; background:#ffffff; border:1px solid #4d4d4d; box-sizing:border-box;}
.mainCont02 .article02 .rateW h6 {float:left; margin:0 0 26px 0; font-size:1.6rem; font-size:16px; color:#1a1a1a;}
.mainCont02 .article02 .rateW em {float:right; font-size:2.0rem; font-size:20px; color:#008675;}
.mainCont02 .article02 .rateW em small {font-size:1.4rem; font-size:14px; font-weight:400;}
.mainCont02 .article02 .rateW em .btnGlobal {padding-right:20px; background:url('../images/pc/main/icoDown.png') no-repeat right center; background-size:10px; color:#008675;}
.mainCont02 .article02 .rateW table {width:100%; border-collapse:collapse; border-spacing:0;}
.mainCont02 .article02 .rateW table th {font-size:1.2rem; font-size:12px; font-weight:400; color:#888888;}
.mainCont02 .article02 .rateW table td {font-weight:600; color:#333333;}
.mainCont02 .article02 .rateW table.mainTbl01 th {padding-bottom:6px; border-bottom:1px solid #808080;}
.mainCont02 .article02 .rateW table.mainTbl01 td {padding:2px 0; text-align:center;}
.mainCont02 .article02 .rateW table.mainTbl01 tbody tr:first-child td {padding-top:6px;}
.mainCont02 .article02 .rateW table.mainTbl02 tbody tr:first-child {border-bottom:1px solid #808080;}
.mainCont02 .article02 .rateW table.mainTbl02 th {padding:8px 0 0 0; text-align:left;}
.mainCont02 .article02 .rateW table.mainTbl02 td {padding:7px 0 0 0; font-size:2.5rem; font-size:25px; text-align:right;}
.mainCont02 .article02 .rateW table.mainTbl02 td small {font-size:1.5rem; font-size:15px;}
.mainCont02 .article02 .rateW table.mainTbl02 tbody tr:first-child th {padding:0 0 6px 0;}
.mainCont02 .article02 .rateW table.mainTbl02 tbody tr:first-child td {padding:0 0 6px 0;}
.mainCont02 .article02 .rateW:first-child .linkMore {padding-top:8px;}
.mainCont02 .article02 .rateW .linkMore {display:block; padding-top: 30px; color:#333333;}
.mainCont02 .article02 .rateW .linkMore img {width:8px;}
.mainCont02 .article02 .rateW .asof {font-size:1.1rem; font-size:11px; font-weight:500; color:#4c4c4c;}
.mainCont02 .article02 .rateW .moneyG ul {display:none; overflow:auto; height:105px; padding:0; margin:35px 0 0 0; border-top:1px solid #cccccc; text-align:center; list-style:none;}
.mainCont02 .article02 .rateW .moneyG ul::-webkit-scrollbar {width:8px; height:8px; background-color:rgba(120,120,120,.1);}
.mainCont02 .article02 .rateW .moneyG ul::-webkit-scrollbar-track {border-radius:10px; background-color:rgba(120,120,120,.1);}
.mainCont02 .article02 .rateW .moneyG ul::-webkit-scrollbar-thumb {border-radius:10px; -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);}
.mainCont02 .article02 .rateW .moneyG ul::-webkit-scrollbar-thumb:hover {border-radius:10px; background-color:#aeaeae;}
.mainCont02 .article02 .rateW .moneyG ul li {padding:6px 0;}
.mainCont02 .article02 .rateW .moneyG ul li:first-child {padding-top:18px;}
.mainCont02 .article02 .rateW .moneyG ul li a {font-size:1.5rem; font-size:15px; font-weight:500; color:#4c4c4c;}
.mainCont02 .article02 .rateW .moneyG ul li a:hover {color:#008675;}
.mainCont02 .article02 .rateW .moneyG.on {position:absolute; top:0; right:0; width:98px; padding:20px 12px 18px 12px; border-bottom:1px solid #595959; border-left:1px solid #595959; background:#ebebeb; box-sizing:border-box;}
.mainCont02 .article02 .rateW .moneyG.on em .btnGlobal {background-image:url('../images/pc/main/icoUp.png');}
.mainCont02 .article02 .rateW .moneyG.on em {margin-right:8px;}
.mainCont02 .article02 .rateW .moneyG.on ul {display:block;}

.bx-wrapper .bx-pager .bx-pager-item{display:inline-block; vertical-align:baseline;}
.bx-wrapper .bx-pager {position:absolute; bottom:9px; left:18px;}
.bx-wrapper .bx-pager.bx-default-pager a {position:relative; display:block; width:8px; height:8px; margin:0 3px; background:#ffffff; border-radius:4px; text-indent:-9999px;}
.bx-wrapper .bx-pager.bx-default-pager a.active {top:-3.5px; width:14px; height:14px; border-radius:7px; background:#008675;}
.bx-wrapper .bx-controls-direction a {position:absolute; bottom:13px; width:28px; height:28px; text-indent:-9999px; outline:0; z-index:10; }
.bx-wrapper .bx-prev {right:43px; background:url('../images/pc/main/btnLeft.png') no-repeat; background-size:100%;}
.bx-wrapper .bx-next {right:13px; background:url('../images/pc/main/btnRight.png') no-repeat; background-size:100%;}


/* Small */
@media (max-width:767px){
	.mainCont01 {padding:10px 0 13px 0;}
	.mainCont01 .mainContW > ul > li {width:50%; height:162px; padding:8px 13px;}
	.mainCont01 .mainContW > ul > li h5 {margin:6px 0 3px 0; font-size:1.9rem; font-size:19px;}
	.mainCont01 .mainContW > ul > li h5:after {display:none;}
	.mainCont01 .mainContW > ul > li img {bottom:10px;}
	.mainCont01 .mainContW > ul > li em {font-size:1.9rem; font-size:19px;}
	.mainCont01 .mainContW > ul > li:nth-child(1) {margin:0;}
	.mainCont01 .mainContW > ul > li:nth-child(2) {border-bottom:0;}
	.mainCont01 .mainContW > ul > li:nth-child(3) {border:0; border-top:1px solid #ffffff; border-left:1px solid #ffffff;}
	.mainCont01 .mainContW > ul > li:nth-child(6) {margin:0;}
	.mainCont01 .mainContW > ul > li:nth-child(8) {border-top:1px solid #ffffff; border-bottom:0;}
	.mainCont01 .mainContW > ul > li:nth-child(9) {border-top:0; border-left:1px solid #ffffff;}
	.mainCont01 .mainContW > ul > li:hover h5 {display:none;}
	.mainCont01 .mainContW > ul > li ul li {padding:4px 0 4px 13px;}
	.mainCont02 .article02 .rateW em .btnGlobal {background-image:url('../images/mobile/main/icoDown.png');}
	.mainCont02 .article02 .rateW .moneyG.on em .btnGlobal {background-image:url('../images/mobile/main/icoUp.png');}

	.bx-wrapper .bx-controls-direction a {top:50%; width:40px; height:40px; margin-top:-20px;}
	.bx-wrapper .bx-prev {left:-13px;}
	.bx-wrapper .bx-next {right:-13px;}
	.bx-wrapper .bx-pager {bottom:8px;}
	
	.mainBnkM li.corpbtn {width:100%;}
}
/* Tablet portrait */
@media (min-width:768px) and (max-width:1023px){

}

/* Tablet portrait */
@media (max-width:1023px){
	.mainCont02 .article01 {width:100%;}
	.mainCont02 .article02 {position:relative; width:100%;}
	.mainCont02 .article02 .rateW {width:100%; margin-top:10px;}
	.mainCont02 .article02 .rateW:first-child {border-right:1px solid #4d4d4d;}

	/* main GNB */
	.mainHead .head h1 a {display:block;}
	.mainHead .head h1 a img {width:152px; vertical-align:middle;}
	.mainBnkM {overflow:hidden; padding:0; margin:55px 0 0 0; list-style:none;}
	.mainBnkM li.corpbtn {width:100%;}
	.mainBnkM li {float:left; width:50%; background:#b3b3b3;}
	.mainBnkM li.on {background:#008675;}
	.mainBnkM li.on a {font-weight:700;}
	.mainBnkM li a {display:block; line-height:44px; font-size:14px; font-size:1.4rem; text-align:center; color:#ffffff;}
}

/* PC */
@media (min-width:1024px){
	.mainContW {width:1000px; padding:0; margin:0 auto;}
	.mainCont01 {margin-top:-33px;}

	/* main GNB */
	.mainHead .gnb {background-image:url('../images/pc/common/layout/bgMainGnb.png');}
	.mainHead .gnb.on {background-image:url('../images/pc/common/layout/bgMainGnbH.png');}
	.mainHead .gnb > ul li ul li a {color:#333333;}
	.mainHead .gnb > ul li ul li:hover a, .mainHead .gnb > ul li ul li.on a {color:#008675;}
	.mainBnkM {display:none;}
}