@charset "UTF-8";

/* ========================================
	base
======================================== */
html,
body {
	height: 100%;
	background-color: #FFF;
}
body > #wrapper {
	height: auto;
}

#wrapper {
	position: relative;
	height:100%;/* for IE6 */
	min-height:100%;
}
#header {
	position: relative;
	margin: 0 auto;
	min-width: 960px;
	top: 0;
	z-index: 110;
}
#contents.index{
	background-image: url(../job/images/index/bg_base.jpg);
	background-position: center top;
	background-repeat: repeat;	
}
#contents.makeup{
	background-image: url(../job/images/makeup/bg_base.jpg);
	background-position: center top;
	background-repeat: repeat;	
}
#contents.beautician{
	background-image: url(../job/images/beautician/bg_base.jpg);
	background-position: center top;
	background-repeat: repeat;	
}
#contents.model{
	background-image: url(../job/images/model/bg_base.jpg);
	background-position: center top;
	background-repeat: repeat;	
}
#contents.designer{
	background-image: url(../job/images/designer/bg_base.jpg);
	background-position: center top;
	background-repeat: repeat;	
}

/* ========================================
	job common
======================================== */
#jobnavi{
	position: absolute;
	top: 320px;
	left: 0;
}
#jobnavi .jobnavi-list{
	position: relative;
}
#jobnavi .jobnavi-01{
	position: absolute;
	top: 0;
	left: 0;
}
#jobnavi .jobnavi-02{
	position: absolute;
	top: 10px;
	left: 137px;
}
#jobnavi .jobnavi-03{
	position: absolute;
	top: 0;
	left: 275px;
}
#jobnavi .jobnavi-04{
	position: absolute;
	top: 10px;
	left: 410px;
}
#jobnavi .jobnavi-05{
	position: absolute;
	top: 0;
	left: 548px;
}
#jobnavi .nav-on{
	display: none;
	position: absolute;
	top: 0;
	left: 0;
}

/* ========================================
	index
======================================== */

/*	#area1
---------------------------------------- */
.index #area1{
	height: 504px;
	background-image: url(../job/images/index/bg_area1.jpg);
	background-position: center top;
	background-repeat: repeat;
}
.index .area1-bg{
	background-image: url(../job/images/index/bg_area1.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 504px;
}
.index #area1 .lead{
	position: absolute;
	top: 50px;
	left: -78px;
}
.index #area1 .main-txt{
	position: absolute;
	top: 99px;
	left: -7px;
}
.index #area1 .img1{
	position: absolute;
	top: 13px;
	left: 690px;
	width: 349px;
	height: 683px;
	z-index: 100;
}

/*	#area2
---------------------------------------- */
.index #area2{
	background-image: url(../job/images/index/bg_area2.jpg);
	background-position: center top;
	background-repeat: repeat;
	height: 650px;
	position: relative;
}
.index #area2 .inner{
	z-index: 10;
}
.index .area2-bg{
	background-image: url(../job/images/index/bg_area2.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 650px;
}
.index .lace-top{
	background-image: url(../job/images/index/lace_top.png);
	background-position: center top;
	background-repeat: repeat-x;
	height: 650px;
}
.index .lace-bottom{
	background-image: url(../job/images/index/lace_bottom.png);
	background-position: center bottom;
	background-repeat: repeat-x;
	height: 650px;
}
.index #area2 .img1{
	position: absolute;
	top: -26px;
	left: -54px;
}
.index #area2 .img2{
	position: absolute;
	top: 67px;
	left: -3px;
}
.index #area2 .img3{
	position: absolute;
	top: -41px;
	left: 598px;
}
.index #area2 .img4{
	position: absolute;
	top: 129px;
	left: -23px;
	z-index: 10;
}
.index #area2 .img5{
	position: absolute;
	top: 400px;
	left: 554px;
	z-index: 1;
}
.index #area2 .img6{
	position: absolute;
	top: 459px;
	left: 142px;
	z-index: 1;
}

/*	#area3
---------------------------------------- */
.index #area3{
	min-height: 1000px;
}
.index .area3-bg{
	background-image: url(../job/images/index/bg_area3.png);
	background-position: center top;
	background-repeat: no-repeat;
	min-height: 1030px;
}
.index #area3 .img1{
	margin: 0 0 15px -4px;
	padding: 25px 0 0 0;
}
.index #area3 .img2{
	margin: 30px 0 0 35px;
	padding: 0 0 0 0;
}
.no-js .index #area3 .img2{
	margin: 0 0 0 35px;
	padding: 0 0 50px 0;
}

/*	#sldr
---------------------------------------- */
.sldr-prev-btn,
.sldr-next-btn {
	display: block;
	position: absolute;
	top: 153px;
	width: 65px;
	height: 121px;
}
.sldr-prev-btn {
	left: 10px;
	/*background: url(../img/prev.png) center center no-repeat;*/
}
.sldr-next-btn {
	right: 10px;
	/*background: url(../img/next.png) center center no-repeat;*/
}
.sldr-prev-btn .nav-on,
.sldr-next-btn .nav-on{
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
}
#sldr {
	position: relative;
	width: 960px;
	margin: 0 auto;
}
#sldr .sldr-main {
	position: relative;
	width: 798px;
	overflow: hidden;
	margin: 0 auto;
	z-index: 10;
}
#sldr .sldr-main ul {
	padding: 25px 0 0;
}
.no-js #sldr .sldr-main li {
	height: 490px;
}
#sldr .sldr-main li {
	width: 395px;
	float: left;
	padding: 0 2px;
	position: relative;
}
#sldr .sldr-main .sldr01 img{
	position: relative;
	top: 0;
	left: 0;
}
#sldr .sldr-main .sldr02 img{
	position: relative;
	top: -25px;
	left: 0;
}
#sldr .sldr-main .sldr03 img{
	position: relative;
	top: 15px;
	left: 0;
}
#sldr .sldr-main .sldr04 img{
	position: relative;
	top: 0;
	left: 0;
}
#sldr .sldr-main .sldr05 img{
	position: relative;
	top: -25px;
	left: 0;
}
#sldr .sldr-main .sldr06 img{
	position: relative;
	top: 15px;
	left: 0;
}
#sldr .sldr-main .sldr07 img{
	position: relative;
	top: 0;
	left: 0;
}
#sldr .sldr-main .sldr08 img{
	position: relative;
	top: -25px;
	left: 0;
}
#sldr .sldr-main .sldr09 img{
	position: relative;
	top: 15px;
	left: 0;
}
#sldr .sldr-main .sldr10 img{
	position: relative;
	top: 0;
	left: 0;
}
#sldr .sldr-main .sldr11 img{
	position: relative;
	top: -25px;
	left: 0;
}
#sldr .sldr-main .sldr12 img{
	position: relative;
	top: 15px;
	left: 0;
}
#sldr .sldr-main .sldr13 img{
	position: relative;
	top: 0;
	left: 0;
}
#sldr .sldr-main .sldr14 img{
	position: relative;
	top: -25px;
	left: 0;
}
#sldr .sldr-main .sldr15 img{
	position: relative;
	top: 15px;
	left: 0;
}


#sldr .sldr-thumb {
	display: none;
	position: relative;
	width: 750px;
	height: 89px;
	overflow: hidden;
	margin: -28px auto 0;
	border: 5px solid #fff;
	border-radius: 10px;
	padding: 6px 0 0;
	background-image:url(../job/images/index/logo_bg.png);
	background-position: center top;
	background-repeat:no-repeat;
}
#sldr .sldr-thumb-inner {
	position: relative;
	width: 212px;
	margin: 0 auto 20px;
}
#sldr .sldr-thumb li {
	float: left;
	padding: 0 11px;
}


.no-js .sldr-prev-btn,
.no-js .sldr-next-btn{
	display: none;
}

/* ========================================
	makeup
======================================== */

/*	#area1
---------------------------------------- */
.makeup #area1{
	height: 504px;
	background-image: url(../job/images/makeup/bg_area1.jpg);
	background-position: center top;
	background-repeat: repeat;
}
.makeup .area1-bg{
	background-image: url(../job/images/makeup/bg_area1.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 504px;
}
.makeup #area1 .lead{
	position: absolute;
	top: 50px;
	left: -78px;
}
.makeup #area1 .main-txt{
	position: absolute;
	top: 99px;
	left: -7px;
}
.makeup #area1 .img1{
	position: absolute;
	top: 11px;
	left: 737px;
	width: 209px;
	height: 662px;
	z-index: 100;
}

/*	#area2
---------------------------------------- */
.makeup #area2{
	background-image: url(../job/images/makeup/bg_area2.jpg);
	background-position: center top;
	background-repeat: repeat;
	height: 640px;
	position: relative;
}
.makeup #area2 .inner{
	z-index: 10;
}
.makeup .area2-bg{
	background-image: url(../job/images/makeup/bg_area2.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 640px;
}
.makeup .lace-top{
	background-image: url(../job/images/makeup/lace_top.png);
	background-position: center top;
	background-repeat: repeat-x;
	height: 640px;
}
.makeup .lace-bottom{
	background-image: url(../job/images/makeup/lace_bottom.png);
	background-position: center bottom;
	background-repeat: repeat-x;
	height: 640px;
}
.makeup #area2 .img1{
	position: absolute;
	top: -26px;
	left: -54px;
}
.makeup #area2 .img2{
	position: absolute;
	top: 67px;
	left: -3px;
}
.makeup #area2 .img3{
	position: absolute;
	top: 146px;
	left: -4px;
}
.makeup #area2 .img4{
	position: absolute;
	top: 191px;
	left: 16px;
	z-index: 10;
}
.makeup #area2 .img5{
	position: absolute;
	top: 226px;
	left: 452px;
	z-index: 1;
}

/*	#area3
---------------------------------------- */
.makeup #area3{
	height: 1056px;
}
.makeup .area3-bg{
	background-image: url(../job/images/makeup/bg_area3.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 1056px;
}
.makeup #area3 .img1{
	position: absolute;
	top: 40px;
	left: -4px;
}
.makeup #area3 .img2{
	position: absolute;
	top: 161px;
	left: 1px;
}
.makeup #area3 .img3{
	position: absolute;
	top: 589px;
	left: 41px;
}
.makeup #area3 .img4{
	position: absolute;
	top: 745px;
	left: 35px;
}

/* ========================================
	beautician
======================================== */

/*	#area1
---------------------------------------- */
.beautician #area1{
	height: 504px;
	background-image: url(../job/images/beautician/bg_area1.jpg);
	background-position: center top;
	background-repeat: repeat;
}
.beautician .area1-bg{
	background-image: url(../job/images/beautician/bg_area1.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 504px;
}
.beautician #area1 .lead{
	position: absolute;
	top: 50px;
	left: -78px;
}
.beautician #area1 .main-txt{
	position: absolute;
	top: 99px;
	left: -7px;
}
.beautician #area1 .img1{
	position: absolute;
	top: 15px;
	left: 650px;
	width: 209px;
	height: 662px;
	z-index: 100;
}

/*	#area2
---------------------------------------- */
.beautician #area2{
	background-image: url(../job/images/beautician/bg_area2.jpg);
	background-position: center top;
	background-repeat: repeat;
	height: 599px;
	position: relative;
}
.beautician #area2 .inner{
	z-index: 10;
}
.beautician .area2-bg{
	background-image: url(../job/images/beautician/bg_area2.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 599px;
}
.beautician .lace-top{
	background-image: url(../job/images/beautician/lace_top.png);
	background-position: center top;
	background-repeat: repeat-x;
	height: 599px;
}
.beautician .lace-bottom{
	background-image: url(../job/images/beautician/lace_bottom.png);
	background-position: center bottom;
	background-repeat: repeat-x;
	height: 599px;
}
.beautician #area2 .img1{
	position: absolute;
	top: -27px;
	left: -53px;
}
.beautician #area2 .img2{
	position: absolute;
	top: 69px;
	left: -4px;
}
.beautician #area2 .img3{
	position: absolute;
	top: 113px;
	left: 4px;
}

/*	#area3
---------------------------------------- */
.beautician #area3{
	height: 927px;
}
.beautician .area3-bg{
	background-image: url(../job/images/beautician/bg_area3.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 927px;
}
.beautician #area3 .img1{
	position: absolute;
	top: -118px;
	left: 384px;
}
.beautician #area3 .img2{
	position: absolute;
	top: -22px;
	left: 13px;
}
.beautician #area3 .img3{
	position: absolute;
	top: 477px;
	left: 41px;
}
.beautician #area3 .img4{
	position: absolute;
	top: 619px;
	left: 35px;
}

/* ========================================
	model
======================================== */

/*	#area1
---------------------------------------- */
.model #area1{
	height: 504px;
	background-image: url(../job/images/model/bg_area1.jpg);
	background-position: center top;
	background-repeat: repeat;
}
.model .area1-bg{
	background-image: url(../job/images/model/bg_area1.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 504px;
}
.model #area1 .lead{
	position: absolute;
	top: 50px;
	left: -78px;
}
.model #area1 .main-txt{
	position: absolute;
	top: 99px;
	left: -7px;
}
.model #area1 .img1{
	position: absolute;
	top: 17px;
	left: 725px;
	z-index: 100;
}

/*	#area2
---------------------------------------- */
.model #area2{
	background-image: url(../job/images/model/bg_area2.jpg);
	background-position: center top;
	background-repeat: repeat;
	height: 649px;
	position: relative;
}
.model #area2 .inner{
	z-index: 10;
}
.model .area2-bg{
	background-image: url(../job/images/model/bg_area2.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 649px;
}
.model .lace-top{
	background-image: url(../job/images/model/lace_top.png);
	background-position: center top;
	background-repeat: repeat-x;
	height: 649px;
}
.model .lace-bottom{
	background-image: url(../job/images/model/lace_bottom.png);
	background-position: center bottom;
	background-repeat: repeat-x;
	height: 649px;
}
.model #area2 .img1{
	position: absolute;
	top: -27px;
	left: -53px;
}
.model #area2 .img2{
	position: absolute;
	top: 68px;
	left: -1px;
}
.model #area2 .img3{
	position: absolute;
	top: -9px;
	left: -8px;
}

/*	#area3
---------------------------------------- */
.model #area3{
	height: 969px;
}
.model .area3-bg{
	background-image: url(../job/images/model/bg_area3.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 969px;
}
.model #area3 .img1{
	position: absolute;
	top: 14px;
	left: 27px;
}
.model #area3 .img2{
	position: absolute;
	top: 7px;
	left: 497px;
}
.model #area3 .img3{
	position: absolute;
	top: 589px;
	left: 41px;
}

/* ========================================
	designer
======================================== */

/*	#area1
---------------------------------------- */
.designer #area1{
	height: 504px;
	background-image: url(../job/images/designer/bg_area1.jpg);
	background-position: center top;
	background-repeat: repeat;
}
.designer .area1-bg{
	background-image: url(../job/images/designer/bg_area1.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 504px;
}
.designer #area1 .lead{
	position: absolute;
	top: 50px;
	left: -78px;
}
.designer #area1 .main-txt{
	position: absolute;
	top: 99px;
	left: -7px;
}
.designer #area1 .img1{
	position: absolute;
	top: 19px;
	left: 697px;
	z-index: 100;
}

/*	#area2
---------------------------------------- */
.designer #area2{
	background-image: url(../job/images/designer/bg_area2.jpg);
	background-position: center top;
	background-repeat: repeat;
	height: 869px;
	position: relative;
}
.designer #area2 .inner{
	z-index: 10;
}
.designer .area2-bg{
	background-image: url(../job/images/designer/bg_area2.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 869px;
}
.designer .lace-top{
	background-image: url(../job/images/designer/lace_top.png);
	background-position: center top;
	background-repeat: repeat-x;
	height: 869px;
}
.designer .lace-bottom{
	background-image: url(../job/images/designer/lace_bottom.png);
	background-position: center bottom;
	background-repeat: repeat-x;
	height: 869px;
}
.designer #area2 .img1{
	position: absolute;
	top: -28px;
	left: -53px;
}
.designer #area2 .img2{
	position: absolute;
	top: 70px;
	left: 0;
}
.designer #area2 .img3{
	position: absolute;
	top: 42px;
	left: 0px;
}
.designer #area2 .img4{
	position: absolute;
	top: 667px;
	left: 41px;
}

/*	#area3
---------------------------------------- */
.designer #area3{
	height: 738px;
}
.designer .area3-bg{
	background-image: url(../job/images/designer/bg_area3.png);
	background-position: center top;
	background-repeat: no-repeat;
	height: 738px;
}
.designer #area3 .img1{
	position: absolute;
	top: -8px;
	left: 25px;
}
.designer #area3 .img2{
	position: absolute;
	top: 15px;
	left: 522px;
}
.designer #area3 .img3{
	position: absolute;
	top: 419px;
	left: 35px;
}


/* ========================================
	#footer
======================================== */
#footer {
	text-align: center;
}

#footer .copyright {
	float: right;
}