
@media (min-width: 768px) {
  .pc {
    display: block !important;
  }
  .sp {
    display: none;
  }
}

@media (max-width: 767px) {
  .pc {
    display: none;
  }
  .sp {
    display: block !important;
  }
}


@media (min-width: 768px) {

* {
    margin: 0;
}

html, body {
	margin:0;
	padding:0;
}

#cnt00{
	background-color:#f1f1f1;
}

#cnt02{
	width:960px;
	clear:both;
	height:300px;
	background-color:#f1f1f1;
	display:block;
	overflow:hidden;
}

#cnt02 h3{
	padding-top:20px;
	padding-left:40px;
}
	
#cntBlock00{
	width:960px;
	height:30px;
    position:relative;
	margin:0;
	padding:0;
	font-size:10px;
	color:#666666;
	overflow:hidden;
}

#cntBlock00 ul{
    position:relative;
	margin-top:10px;
	padding:0;
}


#cntBlock00 ul li{
	display:inline;
    position:relative;
	margin:0;
	padding:0;
	color:#666666;
}

#cntBlock00 ul li a{
	color:#666666;
}

#cntBlock00 ul li a:hover{
	text-decoration:underline;
	color:#666666;
}

img {
	margin:0;
	padding:0;
	border:0;
}

#contentline04{
	width:910px;
	height:1px;
    position:relative;
	padding:0;
	display:block;
	margin-top:70px;
	margin-bottom:40px;
}


/* #contentBody */
#contentBody{
    margin:0 auto;
	padding:0;
	width:960px;
    position:relative;
	overflow:hidden;
	
}

/* #contentarea */
#contentarea{
	background-color:#FFFFFF;
	/*width:960px;*/
    position:relative;
	overflow:hidden;
}

/* #footerarea */
#footerarea{
	 height:45px; 
	position: absolute;
	margin:0;
	padding:0;
	background-color:#66C4D0;
	/* overflow:hidden; */
	margin-bottom: 0px;
/*	padding-bottom: 45px;*/
    width: 100%;
}

#footerarea span{
	visibility:hidden;
}

#footerarea .allBlock01{
	width:1000px;
	height:45px;
	margin:0;
	padding:0;
	position:absolute;
	margin:0px auto;
	overflow:hidden;
	left: 50%;
    margin-left: -500px;
}



#footerarea .leftBlock01{
	width:340px;
	height:45px;
	margin:0;
	padding:0;
	display:block;
	float:left;
	position:relative;
	overflow:hidden;
	margin-left:15px;
}

#footerarea .leftBlock01 img{
	margin-top:15px;
	margin-left:25px;
}


#footerarea .leftBlock02{
	width:325px;
	height:45px;
	margin:0;
	padding:0;
	display:block;
	float:left;
	position:relative;
	overflow:hidden;
}

#footerarea .leftBlock02 img{
	margin-top:15px;
}



#footerarea .rightBlock01{
	width:295px;
	height:45px;
	margin:0;
	padding:0;
	display:block;
	float:left;
	position:relative;
	overflow:hidden;
}



#footerarea .rightBlock01 ul{
	position:relative;
	width:268px;
	height:12px;
	overflow:hidden;
	margin-top:15px;
	padding:0;
	display:block;
	float:left;
}

#footerarea .rightBlock01 ul li{
	overflow:hidden;
	list-style:none;
	position:relative;
	float:left;
	display:block;
	height:12px;
}

#footerarea .rightBlock01 ul li a{
	overflow:hidden;
	display:block;
	background:url(/library/kodate/products/steel3/alp/flexibleplus2/image/fp_footer_btn_001.gif) no-repeat;
	background-position:0px 0px;
	list-style:none;
	position:relative;
	float:left;
	height:12px;
}

#footerarea .rightBlock01 ul .li01 {width:100px;}
#footerarea .rightBlock01 ul .li02 {width:168px;}


#footerarea .rightBlock01 ul .li01 a{background-position:0 0; width:100px;}
#footerarea .rightBlock01 ul .li01 a:hover{background-position:0 -14px;}
#footerarea .rightBlock01 ul .li02 a{background-position:-100px 0; width:168px;}
#footerarea .rightBlock01 ul .li02 a:hover{background-position:-100px -14px;}


}

@media (min-width: 768px) {
/* #cnt */
#cnt{
	width:960px;
	margin:0;
	padding:0;
	position:relative;
	overflow:hidden;
}


#contentBody span{
	visibility:hidden;
}


#cntBlock01{
	width:960px;
	height:585px;
    position:relative;
	margin:0;
	padding:0;
	background:url(/library/kodate/products/steel3/alp/flexibleplus2/image/fp_h1_001.jpg) no-repeat;
}


#cntBlock01 #sh a{
	width:140px;
	padding:0;
	display:block;
	overflow:hidden;
	height:16px;
	background-position:0px 0px;
	position:relative;
	top:20px;
	left:800px;
}


#cntBlock01 #sh2 a{
	background:url("/library/kodate/products/steel3/alp/flexibleplus2/image/fp_btn_001_20201111_1.jpg") no-repeat;
	width:578px;
	padding:0;
	display:block;
	overflow:hidden;
	height:200px;
	background-position:0px 0px;
	position:relative;
	top:345px;
	left:40px;
}

#cntBlock01 #sh2 a:hover{
	width:578px;
	padding:0;
	display:block;
	overflow:hidden;
	height:200px;
	background-position:0px -200px;
	position:relative;
}


#leftarea{
	width:960px;
    position:relative;
	padding:0;
	margin-left:0;
	display:block;
	overflow:hidden;
}

#leftarea span{

}

#cntBlock02{
	width:960px;
    position:relative;
	margin-top:0px;
	margin-left:0px;
	padding:0;
	display:block;
	overflow:hidden;
	background-position:0px 0px;
}

#cntBlock02 p{
	width:534px;
    position:relative;
	top:125px;
	left:65px;
	padding:0;
	display:block;
}


#cntBlock03{
	width:960px;
	position:relative;
	margin-left:0px;
	margin-top:0px;
	margin-bottom:50px;
	padding:0;
	display:block;
	overflow:hidden;
	background-position:0px 0px;
	height:200px;
}

#cntBlock03 a{
	background-image:url("/library/kodate/products/steel3/alp/flexibleplus2/image/fp_btn_002_20201111_1.jpg");
	background-repeat:no-repeat;
	background-position:0 0;
	display: block;
	width:960px;
	height:200px;
}

#cntBlock03 a:hover {
	background-repeat:no-repeat;
	background-position:0 -200px;
	display: block;    
	width:960px;
	height:200px;
}

#cntBlock04{
	margin-bottom:50px;
    position:relative;
	margin-top:0px;
	margin-left:0px;
	padding:0;
	display:block;
	overflow:hidden;
	background-position:0px 0px;
	background-color:#FFFCD1;
}

#cntBlock05{
	width:960px;
    position:relative;
	margin-top:0px;
	margin-left:0px;
	margin-bottom:75px;
	padding:0;
	display:block;
	overflow:hidden;
	background-position:0px 0px;
}

#cntBlock07{
	width:960px;
	position:relative;
	margin-left:0px;
	margin-bottom:130px;
	padding:0;
	display:block;
	overflow:hidden;
	background-position:0px 0px;
/*	height:460px;*/
}

#cntBlock07 a{
	background-image:url("/library/kodate/products/steel3/alp/flexibleplus2/image/fp_btn_003_20201111_1.jpg");
	background-repeat:no-repeat;
	background-position:0 0;
	display: block;
	width:960px;
	height:460px;
}

#cntBlock07 a:hover {
	background-repeat:no-repeat;
	background-position:0 -460px;
	display: block;    
	width:960px;
	height:460px;
}

#cntBlock08{
	width:960px;
	position:relative;
	margin-left:0px;
	margin-bottom:80px;
	padding:0;
	display:block;
	overflow:hidden;
	background-position:0px 0px;
	height:480px;
}

#cntBlock08 a{
	background-image:url(/library/kodate/products/steel3/alp/flexibleplus2/image/fp_btn_004.jpg);
	background-repeat:no-repeat;
	background-position:0 0;
	display: block;
	width:960px;
	height:480px;
}

#cntBlock08 a:hover {
	background-repeat:no-repeat;
	background-position:0 -480px;
	display: block;    
	width:960px;
	height:480px;
}
}

@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, #footerarea{ position: relative} /* IE11 */
}


@media (max-width: 767px) {
/** reset */
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; }

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, nav.main .link, nav.main.min .link, nav.main .link-pc, nav.main.min .link-pc, nav.main .link-sub, nav.main.min .link-sub, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font-style: normal; font-weight: normal; vertical-align: baseline; background: transparent; }

body { font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; font-size: 13px; font-size: 0.813em \9; line-height: 1.231em; *font-size: small; }

li { list-style: none; }

blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

ins { text-decoration: none; }

del { text-decoration: line-through; }

table { border-collapse: collapse; border-spacing: 0; }

img { vertical-align: bottom; }

:focus { outline: 0; }

a { resize: none; }

/** base */
body { -webkit-text-size-adjust: none; color: #333; }

img { zoom: 0.5; }

a { color: #333; text-decoration: none; }

#wrapper { position: relative; overflow: hidden;}


/** 追加 **/
.button_area_img img{zoom:1;
    width:181px; /* 画像半分のサイズを指定 */
    height:30px; /* 画像半分のサイズを指定 */}
	
#toolbar ul li img{zoom:1;
    width:79px; /* 画像半分のサイズを指定 */
    height:48px; /* 画像半分のサイズを指定 */
}
	
.list-content div img{zoom:1;
    width:88px; /* 画像半分のサイズを指定 */
    height:63px; /* 画像半分のサイズを指定 */}
.logo img{zoom:1;
    width:159px; /* 画像半分のサイズを指定 */
    height:18px; /* 画像半分のサイズを指定 */}
.pc img{zoom:1;
    width:109px; /* 画像半分のサイズを指定 */
    height:30px; /* 画像半分のサイズを指定 */}
	
	.up_btn img{zoom:1;
    width:110px; /* 画像半分のサイズを指定 */
    height:20px; /* 画像半分のサイズを指定 */}

#page-1 .area-content2 img.visual {zoom:1;
    width:320px !important; /* 画像半分のサイズを指定 */
    height:264px !important; /* 画像半分のサイズを指定 */
}
#page-1 .area-content2 { text-align:center; margin-bottom: 30px;}
.slideCell a img {zoom: 1; }
/** 追加 **/


#page-1 { position: relative; padding-bottom: 38px; }
#page-1 header { *zoom: 1; padding: 14px 10px; }
#page-1 header:after { content: ""; display: block; clear: both; }
#page-1 header .logo { float: left; 
/*	padding-bottom: 4px;*/
}
#page-1 header .sitemap { background-size: 7px 8px; -moz-background-size: 7px 8px; -webkit-background-size: 7px 8px; display: block; float: right; padding-top: 8px; padding-left: 8px; font-size: 9px; line-height: 9px; /*background: url(/smp/img/nav/icon-rightblack.png) no-repeat left 8px;*/ background-image: url(/smp/img/nav/icon-rightblack.png);background-position:left 8px; background-repeat:no-repeat; }

#page-1 header .sitemapmenu { float: right; padding-top: 0px; padding-right: 2px;}

#page-1 h1 { padding: 0 10px; font-weight: bold; font-size: 11px; line-height: 2em; background-color: #ccc; }
#page-1 h1 a { display: block; font-weight: bold; }
#page-1 footer { padding: 20px 0 8px; text-align: center; }
#page-1 footer small { font-size: 7px; }

#page-2 header { position: relative; padding: 15px 0 20px; text-align: center; }
#page-2 header .close { position: absolute; right: 10px; top: 20px; }
#page-2 h1 { font-size: 15px; line-height: 1.2em; font-weight: bold; color: #2255a4; }
#page-2 footer { padding: 20px 0 30px; text-align: center; }

/** nav */
/* main nav */
nav.main, nav.main.min { border-top: 1px solid #2255a4; border-bottom: 1px solid #2255a4; }
nav.main dl, nav.main.min dl { border-bottom: 1px solid #cccccc; }
nav.main dl:last-child, nav.main.min dl:last-child { border-bottom: none; }
nav.main dt, nav.main.min dt, nav.main .link, nav.main.min .link, nav.main.min .link, nav.main.min .link, nav.main .link-pc, nav.main.min .link-pc, nav.main.min .link-pc, nav.main.min .link-pc, nav.main .link-sub, nav.main.min .link-sub, nav.main.min .link-sub, nav.main.min .link-sub { *zoom: 1; background: -moz-linear-gradient(top, white, #eeeeee); background: -webkit-gradient(linear, left top, left bottom, from(white), to(#eeeeee)); filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=white,endcolorstr=#eeeeee,gradienttype=0); }
nav.main dt:after, nav.main.min dt:after, nav.main .link:after, nav.main.min .link:after, nav.main.min .link:after, nav.main.min .link:after, nav.main .link-pc:after, nav.main.min .link-pc:after, nav.main.min .link-pc:after, nav.main.min .link-pc:after, nav.main .link-sub:after, nav.main.min .link-sub:after, nav.main.min .link-sub:after, nav.main.min .link-sub:after { content: ""; display: block; clear: both; }
nav.main dt img, nav.main.min dt img, nav.main .link img, nav.main.min .link img, nav.main.min .link img, nav.main.min .link img, nav.main .link-pc img, nav.main.min .link-pc img, nav.main.min .link-pc img, nav.main.min .link-pc img, nav.main .link-sub img, nav.main.min .link-sub img, nav.main.min .link-sub img, nav.main.min .link-sub img { float: left; padding-right: 20px; }
nav.main dt p, nav.main.min dt p, nav.main .link p, nav.main.min .link p, nav.main.min .link p, nav.main.min .link p, nav.main .link-pc p, nav.main.min .link-pc p, nav.main.min .link-pc p, nav.main.min .link-pc p, nav.main .link-sub p, nav.main.min .link-sub p, nav.main.min .link-sub p, nav.main.min .link-sub p { background-size: 14px 14px; -moz-background-size: 14px 14px; -webkit-background-size: 14px 14px; margin-right: 10px; line-height: 63px; font-size: 15px; font-weight: bold; /*background: url(/smp/img/nav/icon-downcircle.png) no-repeat right center; */background-image: url(/smp/img/nav/icon-downcircle.png); background-position:right center; background-repeat:no-repeat;}
nav.main .opened .title p, nav.main.min .opened .title p { background-size: 14px 14px; -moz-background-size: 14px 14px; -webkit-background-size: 14px 14px; background-image: url(/smp/img/nav/icon-upcircle.png); }
nav.main .sub, nav.main.min .sub { border-top: 1px solid #cccccc; }
nav.main .sub a, nav.main.min .sub a { background: #f0f0f0; padding-left: 10px; padding-right: 0; }
nav.main .sub a:last-child, nav.main.min .sub a:last-child { border-bottom: none; }
nav.main .link, nav.main.min .link, nav.main .link-pc, nav.main.min .link-pc, nav.main.min .link-pc, nav.main.min .link-pc, nav.main .link-sub, nav.main.min .link-sub, nav.main.min .link-sub, nav.main.min .link-sub { display: block; border-bottom: 1px solid #cccccc; }
nav.main .link:last-child, nav.main.min .link:last-child, nav.main .link-pc:last-child, nav.main.min .link-pc:last-child, nav.main.min .link-pc:last-child, nav.main.min .link-pc:last-child, nav.main .link-sub:last-child, nav.main.min .link-sub:last-child, nav.main.min .link-sub:last-child, nav.main.min .link-sub:last-child { border-bottom: none; }
nav.main .link p, nav.main.min .link p, nav.main .link-pc p, nav.main.min .link-pc p, nav.main.min .link-pc p, nav.main.min .link-pc p, nav.main .link-sub p, nav.main.min .link-sub p, nav.main.min .link-sub p, nav.main.min .link-sub p { background-size: 14px 14px; -moz-background-size: 14px 14px; -webkit-background-size: 14px 14px; background-image: url(/smp/img/nav/icon-rightcircle.png); }
nav.main .link-pc p, nav.main.min .link-pc p { background-size: 24px 16px; -moz-background-size: 24px 16px; -webkit-background-size: 24px 16px; background-image: url(/smp/img/nav/icon-pcblue.png); }
nav.main .link-sub p, nav.main.min .link-sub p { background-size: 9px 7px; -moz-background-size: 9px 7px; -webkit-background-size: 9px 7px; background-image: url(/smp/img/nav/icon-rightblue.png); }


nav.min.main dt, nav.min.main .link, nav.main.min .link, nav.min.main .link-pc, nav.main.min .link-pc, nav.min.main .link-sub, nav.main.min .link-sub { *zoom: 1; background: #f0f0f0; }
nav.min.main dt:after, nav.min.main .link:after, nav.main.min .link:after, nav.min.main .link-pc:after, nav.main.min .link-pc:after, nav.min.main .link-sub:after, nav.main.min .link-sub:after { content: ""; display: block; clear: both; }
nav.min.main dt img, nav.min.main .link img, nav.main.min .link img, nav.min.main .link-pc img, nav.main.min .link-pc img, /*nav.min.main .link-sub img, nav.main.min .link-sub img { margin: 4px 10px 0 4px; }201601変更*/
nav.min.main .link-sub img, nav.main.min .link-sub img { margin: 10px 10px 6px 4px; }
nav.min.main dt p, nav.min.main .link p, nav.main.min .link p, nav.min.main .link-pc p, nav.main.min .link-pc p, nav.min.main .link-sub p, nav.main.min .link-sub p { margin-right: 10px; /*line-height: 35px;201601変更*/line-height: 40px; font-size: 12px; font-weight: bold; background-image: url(/smp/img/nav/icon-downcircle.png); background-position:right center; background-repeat:no-repeat;}
nav.main.min .right_c p{ margin-right: 10px; /*line-height: 35px;201601変更*/line-height: 40px; font-size: 12px; font-weight: bold; background-image: url(/smp/img/nav/icon-rightcircle.png) !important; background-position:right center; background-repeat:no-repeat;}
nav.min.main .opened.title, nav.min.main .opened .title { background: #cccccc; }
nav.min.main .sub { border-top: 1px solid #cccccc; }
nav.min.main .sub p { /*line-height: 30px;201601変更*/line-height: 35px; background-size: 9px 7px; -moz-background-size: 9px 7px; -webkit-background-size: 9px 7px; background-image: url(/smp/img/nav/icon-rightblue.png); }


#page-2 .main { margin-bottom: 40px; border-top: 1px solid #2255a4; border-bottom: 1px solid #2255a4; }
#page-2 .main li { border-bottom: 1px solid #cccccc; }
#page-2 .main li:last-child { border-bottom: none; }
#page-2 .main a { padding-left: 10px; }
#page-2 .main .sub { border-top: 1px solid #cccccc; }
#page-2 .main .sub a { background: #f0f0f0; padding-left: 30px; }
#page-2 .main .sub a:last-child { border-bottom: none; }
#page-2 > .sub { border-top: 1px solid #cccccc; }
#page-2 .close { background-size: 7px 8px; -moz-background-size: 7px 8px; -webkit-background-size: 7px 8px; padding-left: 10px; background: url(/smp/img/nav/icon-close.png) no-repeat left center; font-size: 9px; line-height: 1em; font-weight: bold; }

/* sub nav */
.main .sub a, nav.sub a { display: block; padding: 0 10px; border-bottom: 1px solid #cccccc; }
.main .sub a p, nav.sub a p { background-size: 9px 7px; -moz-background-size: 9px 7px; -webkit-background-size: 9px 7px; line-height: 44px; font-size: 13px; font-weight: bold; background: #f0f0f0 url(/smp/img/nav/icon-rightblue.png) no-repeat right center; }
.main .sub a.link-pc p, nav.sub a.link-pc p { background-size: 24px 16px; -moz-background-size: 24px 16px; -webkit-background-size: 24px 16px; background-image: url(/smp/img/nav/icon-pcblue.png); }

/* footer nav */
nav.other { *zoom: 1; padding: 15px 0 10px; }
nav.other:after { content: ""; display: block; clear: both; }
/*nav.other a { font-weight: bold; font-size: 9px; line-height: 9px; }*/
/*↓201601変更*/
nav.other a { font-weight: bold; font-size: 11px; line-height: 9px; }

nav.other a:first-child { padding-right: 20px; }
nav.other a img { vertical-align: baseline; }

/* toolbar */
#toolbar { *zoom: 1; position: fixed; background-color: #2454a8; width: 100%; opacity: 1.0 !important; bottom:0px; z-index:99999; }
#toolbar:after { content: ""; display: block; clear: both; }
#toolbar li { float: left; width: 25%; height: 48px; background-color: #fff; }
#toolbar li:last-child a { margin-right: 0; }
#toolbar a { display: block; text-align: center; background-color: #2454a8; margin-right: 2px; height: 48px; }

nav.list-content { padding-top: 20px; }
nav.list-content .sub { padding-top: 10px; }
nav.list-content .sub.first { border-top: 1px solid #cccccc; padding-top: 0; }
nav.list-content .sub h2 { font-size: 13px; line-height: 2.2; font-weight: bold; padding-left: 10px; border-bottom: 1px solid #cccccc; }
nav.list-content .link, nav.list-content nav.main .link-pc, nav.main nav.list-content .link-pc, nav.list-content nav.main.min .link-pc, nav.main.min nav.list-content .link-pc, nav.list-content nav.main .link-sub, nav.main nav.list-content .link-sub, nav.list-content nav.main.min .link-sub, nav.main.min nav.list-content .link-sub { *zoom: 1; display: block; border-bottom: 1px solid #cccccc; }
nav.list-content .link:after, nav.list-content nav.main .link-pc:after, nav.main nav.list-content .link-pc:after, nav.list-content nav.main.min .link-pc:after, nav.main.min nav.list-content .link-pc:after, nav.list-content nav.main .link-sub:after, nav.main nav.list-content .link-sub:after, nav.list-content nav.main.min .link-sub:after, nav.main.min nav.list-content .link-sub:after { content: ""; display: block; clear: both; }
nav.list-content .link img, nav.list-content nav.main .link-pc img, nav.main nav.list-content .link-pc img, nav.list-content nav.main.min .link-pc img, nav.main.min nav.list-content .link-pc img, nav.list-content nav.main .link-sub img, nav.main nav.list-content .link-sub img, nav.list-content nav.main.min .link-sub img, nav.main.min nav.list-content .link-sub img { float: left; padding-right: 15px; }
.link .pc{ background-size: 30px 16px !important; -moz-background-size: 30px 16px !important; -webkit-background-size: 30px 16px !important;background-image: url(/smp/img/nav/icon-pcblue2.png) !important;}
nav.list-content .link p, nav.list-content nav.main .link-pc p, nav.main nav.list-content .link-pc p, nav.list-content nav.main.min .link-pc p, nav.main.min nav.list-content .link-pc p, nav.list-content nav.main .link-sub p, nav.main nav.list-content .link-sub p, nav.list-content nav.main.min .link-sub p, nav.main.min nav.list-content .link-sub p { background-size: 14px 14px; -moz-background-size: 14px 14px; -webkit-background-size: 14px 14px; padding: 5px 0; margin-right: 10px; line-height: 20px; font-size: 15px; font-weight: bold; background: url(/smp/img/nav/icon-rightblue.png) no-repeat right center; }



/** slide by transition */
.slideFrame { width: 320px; height: 180px; overflow: hidden; }

.slideGuide { *zoom: 1; position: relative; width: 1280px; }
.slideGuide:after { content: ""; display: block; clear: both; }

.slideCell { float: left; }

.banner_area {
    clear: both;
	margin:0 auto;
	text-align:center;
	margin-top:10px;
	margin-bottom:10px;
}

.banner_area img{
	height: auto;
    width:93.7%;
}

.banner_area_bottom {
    clear: both;
	margin:0 auto;
	text-align:center;
	margin-top:10px;
	margin-bottom:35px;
}

.banner_area_bottom img{
	height: auto;
    width:93.7%;
}


.area-controller { clear: both; padding: 15px 0 25px; }

.controller { *zoom: 1; width: 127px; margin: 0 auto; }
.controller:after { content: ""; display: block; clear: both; }
.controller li { background-size: 13px 26px; -moz-background-size: 13px 26px; -webkit-background-size: 13px 26px; float: left; width: 13px; height: 13px; margin-left: 25px; overflow: hidden; background-image: url(/smp/img/controller.png); background-repeat: no-repeat; }
.controller li:first-child { margin-left: 0; }
.controller li.current { background-position: 0 -13px; }

/** page */
body { background-color: #eee; }

#wrapper { background-color: #fff; }

#page-2 { display: none; background-color: #fff; }
#page-2 nav.sub a p { background-color: transparent; }

/** contents */
#page-1 .nav-path { font-size: 10px; font-weight: bold; padding: 10px 10px 20px; }
#page-1 .nav-path a { font-weight: bold; }
#page-1 .area-content { margin-bottom: 30px; }
#page-1 .area-content img.visual { width: 100%; height: auto; }
#page-1 .area-content h2 { font-size: 15px; line-height: 1; font-weight: bold; padding: 0 10px 13px; }
#page-1 .area-content h2 img{ zoom:1;width:212px; /* 画像半分のサイズを指定 */height:22px; /* 画像半分のサイズを指定 */}
#page-1 .area-content h2.first { padding-top: 10px; }
#page-1 .area-content h3 { font-size: 13px; font-weight: bold; padding: 10px 10px 0; }
#page-1 .area-content p { padding: 10px 10px 0; font-weight: bold; }
#page-1 .area-content a.link, #page-1 .area-content nav.main a.link-pc, nav.main #page-1 .area-content a.link-pc, #page-1 .area-content nav.main.min a.link-pc, nav.main.min #page-1 .area-content a.link-pc, #page-1 .area-content nav.main a.link-sub, nav.main #page-1 .area-content a.link-sub, #page-1 .area-content nav.main.min a.link-sub, nav.main.min #page-1 .area-content a.link-sub { line-height: 1.6; vertical-align: middle; font-weight: bold; }
#page-1 .area-content a.link img, #page-1 .area-content nav.main a.link-pc img, nav.main #page-1 .area-content a.link-pc img, #page-1 .area-content nav.main.min a.link-pc img, nav.main.min #page-1 .area-content a.link-pc img, #page-1 .area-content nav.main a.link-sub img, nav.main #page-1 .area-content a.link-sub img, #page-1 .area-content nav.main.min a.link-sub img, nav.main.min #page-1 .area-content a.link-sub img { vertical-align: middle; }
#page-1 .area-content .button-document { display: block; margin: 20px 20px 0; background: #0c539e url(/smp/img/icon-document-arrow.png) no-repeat center right; background-size: 19px 7px; -moz-background-size: 19px 7px; -webkit-background-size: 19px 7px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; line-height: 42px; font-size: 15px; font-weight: bold; color: #fff; text-align: center; }
#page-1 nav.pagenav { *zoom: 1; margin: 20px 20px 0; text-align: center; position: relative; }
#page-1 nav.pagenav:after { content: ""; display: block; clear: both; }
#page-1 nav.pagenav span { display: block; font-size: 11px; font-weight: bold; line-height: 30px; }
#page-1 nav.pagenav .prev { position: absolute; top: 0; left: 0; font-size: 11px; text-indent: 8px; text-align: center; font-weight: bold; line-height: 30px; display: block; width: 57px; height: 30px; background: url(/smp/img/pagenav-arrow-left.png) no-repeat; background-size: 57px 30px; -moz-background-size: 57px 30px; -webkit-background-size: 57px 30px; }
#page-1 nav.pagenav .next { position: absolute; top: 0; right: 0; font-size: 11px; text-indent: 8px; text-align: center; font-weight: bold; line-height: 30px; display: block; width: 57px; height: 30px; background: url(/smp/img/pagenav-arrow-right.png) no-repeat; background-size: 57px 30px; -moz-background-size: 57px 30px; -webkit-background-size: 57px 30px; text-indent: -8px; }
#page-1 nav.content { *zoom: 1; width: 100%; }
#page-1 nav.content:after { content: ""; display: block; clear: both; }
#page-1 nav.content li { width: 50%; background: -moz-linear-gradient(top, #ccdceb, #b4cbe1); background: -webkit-gradient(linear, left top, left bottom, from(#ccdceb), to(#b4cbe1)); filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#ccdceb,endcolorstr=#b4cbe1,gradienttype=0); float: left; border-bottom: solid 1px white; }
#page-1 nav.content li a { display: block; }
#page-1 nav.content li a p { font-size: 12px; line-height: 14px; border-right: solid 1px white; padding: 0; }
#page-1 nav.content li a p span { min-height: 30px; display: -webkit-box; -webkit-box-align: center; -webkit-box-pack: center; text-align: center; margin: 3px; font-weight: bold; padding: 2px 6px; }
#page-1 nav.content li.none { min-height: 40px; }
#page-1 nav.content li:nth-child(2n) p { border-right: none; }
#page-1 nav.content .now1 .n1 p span, #page-1 nav.content .now2 .n2 p span, #page-1 nav.content .now3 .n3 p span, #page-1 nav.content .now4 .n4 p span, #page-1 nav.content .now5 .n5 p span, #page-1 nav.content .now6 .n6 p span, #page-1 nav.content .now7 .n7 p span { border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; background: #3160aa; color: #fff; }


#cap a{
	color: #2255A4;
	text-decoration: none;
}

/*#page-1 .area-content .button-document1 { display: block; margin: 20px 20px 0; background: #0c539e url(/library/kodate/products/steel3/alp/flexibleplus2/image/icon-document-arrow1.png) no-repeat center right; background-size: 22px 14px; -moz-background-size: 22px 14px; -webkit-background-size: 22px 14px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; line-height: 42px; font-size: 15px; font-weight: bold; color: #fff; text-align: center; padding:25px; }
#page-1 .area-content .button-document1 .button_area {width:475px;text-align:center; margin:0 auto; clear:both;}
#page-1 .area-content .button-document1 p{ font-weight:bold;padding:0;width:auto;float:left;text-align:left;}
#page-1 .area-content .button-document1 img {margin-right:15px;float:left;text-align:left;}*/

																														
	#page-1 .area-content .button-document1 { display: block; margin: 20px 20px 0; padding: 20px 0px 15px; background: #0c539e; /*background-size: 21px 14px; -moz-background-size: 21px 14px; -webkit-background-size: 21px 14px;*/ border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;font-size: 10px; font-weight: bold; color: #fff; text-align: left;line-height: 1.3; }

	#page-1 .area-content .button-document1 .button_area {text-align:center;display:block;margin:0 auto;}
	#page-1 .area-content .button-document1 .button_area_img{display:block;text-align:center; margin-bottom:0.5em/*float:left;margin-right:0.3em;*/}
#page-1 .area-content .button-document1 .button_area_img img{vertical-align:bottom;}
.button_area_img img {
    height: auto!important;
   width: 250px!important;
}
#page-1 .area-content .button-document1 h4{overflow:hidden; display:block;text-align:center;vertical-align:top;margin:0 auto 0.5em; padding:0;font-size:15px !important;margin-top:0px!important; line-height:1.2; font-weight:bold;}

#page-1 .area-content .button-document1 .button_area_text{overflow:hidden; display:block;text-align:left;width:21em;vertical-align:top;margin:0 auto 1em; padding:0;font-size:12px !important;margin-top:0px!important;}

#page-1 .area-content .button-document1 .button_area_text p{text-align:left; padding:0;vertical-align:top;width:25em;}

#page-1 .area-content .button-document1 .button_area_cat{overflow:hidden; display:block;text-align:center;vertical-align:top;margin:0 auto 1em; padding:0;}

#page-1 .area-content .button-document1 .button_area_cat img{width:140px;height:auto; zoom:1;}

#ml06{overflow:hidden; display:block; margin:0; padding:0; margin-bottom:-30px;}

.button-document2 { display: block; margin: 15px 15px 0; background: #fff; background-size: 21px 14px; -moz-background-size: 21px 14px; -webkit-background-size: 21px 14px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; line-height: 1.231em;font-size: 14px; font-weight: bold; color: #1F4DA0; text-align: left;line-height: 1.000em; padding:15px 10px 15px 10px; border:5px solid #CCCCCC;  text-decoration:none;font-family: "Hiragino Kaku Gothic Pro","Meiryo","sans-serif";}
.button-document2 .button_area {text-align:center;display:block;margin:0 auto;}
.button-document2 .button_area_img{display:block;text-align:center; margin-bottom:0.5em/*float:left;margin-right:0.3em;*/}
 .button-document2 .button_area_img img{vertical-align:bottom;}
.button-document2 .button_area_text{overflow:hidden; display:block;text-align:left;width:20em;vertical-align:top;margin:0 auto; padding:0;font-size:13px !important;margin-top:0px!important;}

.button-document2 .button_area_text p{text-align:left; padding:0;vertical-align:top;width:20em;  text-decoration:none}
.button-document2 .button_area_img img{zoom:1;
    width:205px; /* 画像半分のサイズを指定 */
    height:17px; /* 画像半分のサイズを指定 */}
}




@media (max-width: 767px) {
/******************/
/** {
        box-sizing: border-box;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
     -o-box-sizing: border-box;
}*/

#bg_cover01{
/*background:url(/library/kodate/products/steel3/alp/flexibleplus2/image/index_bg_001.jpg) repeat-x 0 17% !important;*/

}
#bg_cover02{
background:url(/library/kodate/products/steel3/alp/flexibleplus2/image/index_bg_001.jpg) repeat-x 0 -300% !important;
/*background-size:50% 50%;*/

 padding-bottom:50px;
}

.controls li div {
	line-height:0 !important;
}

#page-1 .area-content {
    margin-bottom:0px !important;
}
/*------------------------------
	#cntBlock001	
-------------------------------*/
#cntBlock001	 {
	margin:0 auto;
	padding:0;
	width:100%;
	text-align:center;
	position:relative;
	z-index:500;
	background-color:#FFF;
}

#cntBlock001 h2 {
	text-align:center;
	padding:0;
	width:100%;
}
#cntBlock001 h2 img {
	zoom:1;
    width:320px; /* 画像半分のサイズを指定 */
    height:auto; /* 画像半分のサイズを指定 */
}
#cntBlock001 a{
	position:relative;
	margin-left:0;
	text-align:left;
} 
#cntBlock001 a img{
	text-align:left;
	zoom:1;
	width:283px; /* 画像半分のサイズを指定 */
    height:83px; /* 画像半分のサイズを指定 */
}  

/*------------------------------
	#cntBlock002
-------------------------------*/
#cntBlock002	 {
	margin:0 auto;
	padding:0;
	width:100%;
	position:relative;
	text-align:center;
}
#cntBlock002	 .subBlock001 {
	margin-bottom:30px;
}
#cntBlock002	 .subBlock001 img {
	zoom:1;
	width:320px;
	height:135px;
}  

/*------------------------------
	#cntBlock003
-------------------------------*/
#cntBlock003 {
	margin: 0 auto;
	padding: 0;
	width: 100%;
	text-align: center;
	position: relative;
	margin-top: 0px;
}
#cntBlock003  h2{
	text-align:center;
}
#cntBlock003 h2 img {
	zoom:1;
    width:300px; /* 画像半分のサイズを指定 */
    height:127px; /* 画像半分のサイズを指定 */
}  
#cntBlock003 .subBlock001 img {
	zoom:1;
    width:300px; /* 画像半分のサイズを指定 */
    height:305px; /* 画像半分のサイズを指定 */
	margin-bottom:10px;
} 
#cntBlock003 .subBlock002 img {
	zoom:1;
    width:320px; /* 画像半分のサイズを指定 */
    height:95px; /* 画像半分のサイズを指定 */
	margin-bottom:30px;
}
 
/*------------------------------
	#cntBlock004
-------------------------------*/

#cntBlock004 {
	margin:0 auto;
	padding:0;
	width:100%;
	text-align:center;
	position:relative;
	margin-top:0px;
	margin-bottom:0px;
}

#cntBlock004 h2 {
	text-align:center;
	padding:0;
	width:100%;
	margin-bottom:0px;
}

#cntBlock004 h2 img {
	zoom:1;
    width:300px; /* 画像半分のサイズを指定 */
    height:auto; /* 画像半分のサイズを指定 */
	margin-bottom:30px;
}
#cntBlock004 .subBlock001 img {
	zoom:1;
    width:320px; /* 画像半分のサイズを指定 */
    height:auto; /* 画像半分のサイズを指定 */
	margin-bottom:30px;
} 	
#cntBlock004 .subBlock002 img {
	zoom:1;
    width:320px; /* 画像半分のサイズを指定 */
    height:auto; /* 画像半分のサイズを指定 */
	margin-bottom:30px;
} 	
#cntBlock004 .subBlock003 img {
	zoom:1;
    width:320px; /* 画像半分のサイズを指定 */
    height:auto; /* 画像半分のサイズを指定 */
	margin-bottom:30px;
} 
#cntBlock004 .subBlock004 img {
	zoom:1;
    width:320px; /* 画像半分のサイズを指定 */
    height:95px; /* 画像半分のサイズを指定 */
	margin-bottom:30px;
}
#cntBlock004 .subBlock101 img {
	zoom:1;
    width:320px; /* 画像半分のサイズを指定 */
    height:37px; /* 画像半分のサイズを指定 */
	margin-bottom:30px;
}
#cntBlock004 .subBlock201 img {
	zoom:1;
    width:320px; /* 画像半分のサイズを指定 */
    height:37px; /* 画像半分のサイズを指定 */
	margin-bottom:30px;
}

/*------------------------------
	#cntBlock005
-------------------------------*/

#cntBlock005 {
	margin:0 auto;
	padding:0;
	width:100%;
	text-align:center;
	position:relative;
}
#cntBlock005 h2 {
	text-align:center;
	padding:0;
	width:100%;
}
#cntBlock005 h2 img{
	zoom:1;
    width:300px; /* 画像半分のサイズを指定 */
    height:auto; /* 画像半分のサイズを指定 */
	margin-bottom:30px;
}
#cntBlock005 .subBlock001 img {
	zoom:1;
    width:320px; /* 画像半分のサイズを指定 */
    height:auto; /* 画像半分のサイズを指定 */
} 	


/*------------------------------
	#cntBlock006
-------------------------------*/

#cntBlock006 {
	margin:0 auto;
	padding:0;
	width:100%;
	text-align:center;
	position:relative;
	margin-top:50px;
	margin-bottom:50px;
}
#cntBlock006 .subBlock001 {
	clear:both;
}
#cntBlock006 .subBlock001 img {
	zoom:1;
    width:320px; /* 画像半分のサイズを指定 */
    height:auto; /* 画像半分のサイズを指定 */
}

/*------------------------------
	#cntBlock007
-------------------------------*/

#cntBlock007 {
	margin:0 auto;
	padding:0;
	width:100%;
	text-align:center;
	position:relative;
	margin-top:50px;
	margin-bottom:50px;
}
#cntBlock007 .subBlock001 {
	clear:both;
}
#cntBlock007 .subBlock001 img {
	zoom:1;
    width:320px; /* 画像半分のサイズを指定 */
    height:auto; /* 画像半分のサイズを指定 */
}

}


