@charset "utf-8";
@media all{
*{ padding:0; margin:0;}


/*-----------------------*/
.mt10{margin-top:11px;}
.mt15{margin-top:15px;}
.mt20{margin-top:26px;}
.mt50{margin-top:50px;}
.mt80{margin-top:80px;}
}
/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
 全デバイス共通のスタイルとスマートフォン縦向きレイアウトの指定
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

body { }
#wrap {height:100%;height: auto; margin:0 auto; background: #ffffff;padding: 0px 30px 30px 30px;display: block;} 

#wrap #header{ width:400px; height:40px; margin:0 auto; text-align:left;padding: 0 0 10px 0;}
#wrap #header h1{ padding:0 0 0 0;}
#wrap #container{ width:400px; margin:0 auto; text-align:left;}
#wrap #container #maincol{ width:400px; padding:0; overflow:hidden;}
#wrap #container #maincol .title{ width:400px;height: 86px; padding:0; background:url(../images/small/maincol_bg_01.gif); background-repeat: no-repeat; overflow:hidden;}
#wrap #container #maincol .cate{ width: 400px; height:30px;margin-top: -30px; text-align:center;padding:0 0 0 0;position: relative;}
#wrap #container #maincol .section{ width:330px; padding:0px 35px; background:url(../images/small/maincol_bg_02.gif); overflow:hidden; background-repeat: repeat-y;}
#wrap #container #maincol .section ul{ list-style:none; float:left; text-align:center;}
#wrap #container #maincol .section ul li{ width:165px; height:233px; float:left; display:block; color:#fff;}
#wrap #container #maincol .section ul li a{ font-size:10px; display:inline-block;}
#wrap #container #maincol .section ul li span{ height:12px; padding:13px 0 0 0; line-height:1.2em; display:block;}
#wrap #container #maincol .section ul li img{ width:92px; margin: 5px 0 -5px 0; border: 1px solid #999999; position: relative;}
#wrap #container #maincol .section ul li .btn img{ width:45px; border: 0px;}

img.bg{ display:none;}

/* スマートホン横向き または768px以上*/
@media screen and (orientation:landscape),
	   screen and (min-width: 768px){
#wrap #header{ width:750px;}
#wrap #container{ width:750px;}
#wrap #container #maincol{ width:750px;}
#wrap #container #maincol .title{ width:750px; background:url(../images/medium/maincol_bg_01.gif);height: 86px;}
#wrap #container #maincol .cate{ width:750px;height: 30px;height: 30px;margin-top: -30px;padding: 0 0 0 0;}
#wrap #container #maincol .section{ width:690px; background:url(../images/medium/maincol_bg_02.gif);}
#wrap #container #maincol .section ul li{ width:172px;}

}
/*@media screen and ( max-width: 1024px ){
body{
	padding: 30px;
	}
#wrap #container {
    width: 690px;
}
#wrap {
    height: 100%;
    width: 690px;
    padding: 30px;
    margin:auto;
	}
#wrap #header{
	margin-bottom: 20px;
	}
#wrap #container #maincol .title {
	width: 690px;
	background: url(../images/medium/maincol_bg_01.gif);
	background-size: contain;
	}
#wrap #container #maincol .section {
	width: 620px;
	background: url(../images/medium/maincol_bg_02.gif);
	background-size: contain;
	}
}

/* PC向け及び印刷用レイアウトの指定：1024px以上では固定レイアウト */
@media only screen and (min-width: 1024px), print {
#wrap{ max-width:1100px;}
#wrap #header{ width:1000px;}
#wrap #container{ width:1000px;}
#wrap #container #maincol{ width:1000px;}
#wrap #container #maincol .title{ width:1000px;height: 100px; background:url(../images/large/maincol_bg_01.gif);}
#wrap #container #maincol .cate{ width:1000px;margin-top: -40px;padding: 5px 0 5px 0;}
	#wrap #container #maincol .cate01{ width:1000px;margin-top: -48px;padding: 5px 0 5px 0;}
#wrap #container #maincol .section{ width:930px; background:url(../images/large/maincol_bg_02.gif);}
#wrap #container #maincol .section ul li{ width:186px; height: 253px;}
}
/*@media screen and ( max-width: 768px ){
#wrap {
    height: 100%;
    width: 630px;
    padding: 30px;
    margin: auto;
}
}*/