width: 50%;width: 50%;width: 50%;width: 50%;width: 50%;width: 50%;</p>width: 31%;    /* 横幅を割合で指定 */
    height: auto; width: 31%;    /* 横幅を割合で指定 */
    height: auto; width: 31%;    /* 横幅を割合で指定 */
    height: auto; @charset "UTF-8";

html,body {height:100%;}
body {
	color:#333;
	position:relative;
}

h1,h2,h3,h4,h5,h6,input,button,textarea,select,p,blockquote,table,pre,address,ul,ol,dl {
	font-size:160%;
	line-height:1.8;
}

dt img,dd img,li img,p img {vertical-align:bottom;}

a {
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}

*:first-child+html p {letter-spacing:0;} 

a:link    {color:#b0218f; text-decoration:underline;}
a:visited {color:#b0218f; text-decoration:underline;}
a:hover   {color:#bb409f; text-decoration:underline;}
a:active  {outline:none;}

@media screen and (max-width: 999px) {
html {-webkit-text-size-adjust: 100%;}
h1,h2,h3,h4,h5,h6,input,button,textarea,select,p,blockquote,table,pre,address,ul,ol,dl {font-size:140%; line-height:1.6;}

}

#wrapper{
	width:100%;
	min-width:1000px;
	margin:0 auto;
}

@media screen and (max-width: 999px) {
#wrapper{min-width:100%; padding-top:65px;}

}


/* Header
----------------------------------------*/
#outer_sp_header {
	display:block;
	width:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:99999;
}

.sp_header .logo {
	width:135px;
	height:45px;
    margin: 0 auto;
}
.sp_header .logo a {
	width:100%;
	height:100%;
	display:block;
}
.sp_header .open-menu, .sp_header .close-menu {
	display:block;
	width:45px;
	height:25px;
	position:absolute;
	top:10px;
	right:10px;
}


.menu_btn {
	width:100%;
	height:auto;
	overflow:hidden;
	padding:10px 10px 5px;
	box-sizing:border-box;
}
.menu_btn li {
	width:45px;
	height:45px;
	float:left;
	margin:0 5px 5px 0;
	background:#f4f4f4;
}

p.close_btn {
	background:#f4f4f4;
}
p.close_btn a {
	display:block;
	line-height:1;
	color:#555;
	text-align:center;
	text-decoration:none;
	padding:15px 10px;
}
p.close_btn a:hover {text-decoration:none;}

#outer_sp_header img { width:100%; height:auto;}


.h_btn1 {
    width: 25px;
    height: 25px;
    float: left;
    margin: 10px 0 0 5px;
}



@media screen and (max-width: 999px) {

}



/* Footer
----------------------------------------*/
#outer_footer {
	width:100%;
}
#footer {

}
.copy {
	color:#FFF;
	font-size:11px;
	line-height:1.2;
	text-align:center;
	background:#999;
	padding:20px;
}


@media screen and (max-width: 999px) {
}



@media screen and (max-width: 999px) {
#topImage {width:100%;}
}


/* common
----------------------------------------*/
.pc_area {display:block;}
.sp_area {display:none;}

.f_left {float:left;}
.f_right {float:right;}

.bold {font-weight:bold;}

.txt-l {text-align:left;}
.txt-c {text-align:center;}
.txt-r {text-align:right;}

.alpha a:hover img {
  opacity: 0.8;
  filter: alpha(opacity=80);
  -ms-filter: "alpha(opacity=80)";
}

@media screen and (max-width: 999px) {
.pc_area {display:none;}
.sp_area {display:block;}
}


/* img */
#outer_header img,
#navi img,
#outer_footer img {
	width:100%;
	max-width:100%;
	height:auto;
}


@media screen and (max-width: 999px) {

#wrapper img {
	width:100%;
	max-width:100%;
	height:auto;
}
}


@media screen and (max-width: 764px) {
	


}


#work-wrapper{
	width:100%;
	min-width:1000px;
	margin:0 auto;
}

@media screen and (max-width: 999px) {
#work-wrapper{min-width:100%;}

}

@media screen and (max-width: 999px) {

#work-wrapper img {
	width:100%;
	max-width:100%;
	height:auto;
}
}