@charset "shift_jis";
/* CSS Document */

/* contents setting
------------------------- */

#contents {}

@media handheld, only screen and (max-width: 1064px) {
#sidenav {
	display: none;
	}
}

/* mainv */
#contents #mainv {
	min-height: 220px;
	margin-bottom: 40px;
	background: #1469b9 url(../images/idx_main_bg.jpg) no-repeat left bottom;	
	}
#contents #mainv h1 {
	padding: 22px 0 0 115px;	
	}
#contents #mainv p {
	color: #fff;
	padding: 6px 250px 10px 115px;	
	}

/* cmn */

#contents div.column {
	position: relative;
	min-height:190px;
	margin: 0 0 30px 0;
	padding: 0 0 30px 0;
	border-bottom: #ddd 1px solid;
	}
#contents div.column:last-child {
	margin: 0 0 40px 0;
	padding: 0;
	border-bottom: none;
	}

#contents div#c01 p.icon_medal,
#contents div#c02 p.icon_medal,
#contents div#c03 p.icon_medal {
	position: absolute;
	top: 0;
	left: 0;
	}
#contents div#c01 p.icon_arrow,
#contents div#c02 p.icon_arrow,
#contents div#c03 p.icon_arrow {
	position: absolute;
	top: 55px;
	left: 0;
	}
#contents div#c04 p.icon_arrow,
#contents div#c05 p.icon_arrow {
	position: absolute;
	top: 0;
	left: 0;
	}
#contents div.column p.pic_product {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 50px;
	}
#contents div.column p.pic_product img {
	border: #ccc solid 1px;
	}
#contents div.column p.icon_num {
	position: absolute;
	z-index: 10;
	top: 0;
	left: 50px;
	}
#contents div.column p.icon_new {
	position: absolute;
	z-index: 10;
	top: 0;
	left: 187px;
	}


#contents div.column h2 {
	font-size: 20px;
	font-weight: bold;
	margin: 0 0 10px 260px;
	padding:0;
	color: #990000;
	}
#contents div.column p.leadtxt {
	margin: 0 0 5px 260px;
	font-size: 100%;
	}
#contents div.column p.leadtxt strong {
	font-size: 108%;
	display:block;
	}
#contents div.column p.leadtxt02 {
	margin: 0 0 14px 260px;
	font-size: 100%;
	}
#contents div.column p.leadtxt02 strong {
	font-size: 108%;
	display:block;
	}

#contents div.column ul.btn_links {
	margin:20px 0 0 260px;
	}
#contents div.column ul.btn_links li {
	display: inline;
	margin: 0 0 0 5px;
	padding: 0;
	}
#contents div.column ul.btn_links li:first-child {
	margin: 0;
	}

#contents div.column ul.btn_links li a {
	padding: 5px 12px;
	background-color: #555;
    color: #fff;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
	}
#contents div.column ul.btn_links li a:hover {
	background-color: #777;
	text-decoration: none;
	}

#contents div.column ul.btn_links li:first-child a {
	background-color: #d61518;
	}
#contents div.column ul.btn_links li:first-child a:hover {
	background-color: #777;
	}


@media handheld, only screen and (max-width: 768px) {
/* mainv */
#contents #mainv {
	min-height: inherit;
	margin-bottom: 30px;
	padding:15px;
	background: none;
	background-color:#146bba;
	}
#contents #mainv h1 {
	padding: 0;
	margin-bottom:15px;
	}
#contents #mainv h1 img {
	text-align:left;
	margin: 0;
	}
#contents #mainv p {
	color: #fff;
	padding: 0;
	margin: 0;
	font-size: 108%;
	}

#contents div.column {
	margin: 0 0 25px 0;
	padding: 0 0 25px 0;
	text-align:center;
	}
#contents div.column:last-child {
	margin: 0 0 50px 0;
	}

#contents div#c01 p.icon_medal,
#contents div#c02 p.icon_medal,
#contents div#c03 p.icon_medal {
	display: none;
	}
#contents div#c01 p.icon_arrow,
#contents div#c02 p.icon_arrow,
#contents div#c03 p.icon_arrow {
	display: none;
	}
#contents div#c04 p.icon_arrow,
#contents div#c05 p.icon_arrow {
	display: none;
	}
#contents div.column p.pic_product {
	position: relative;
	top: auto;
	left: auto;
	display:inline-block;
	vertical-align:top;
	}
#contents div.column p.pic_product img {
	width:auto;
	}
#contents div.column p.icon_num {
	position: relative;
	top: auto;
	left: auto;
	display:inline-block;
	vertical-align:top;
	}
#contents div.column p.icon_new {
	display: none;
	}

#contents div.column h2 {
	font-size: 18px;
	margin: 5px auto 15px auto ;
	}

#contents div.column p.leadtxt {
	margin: 0 0 7px 0;
	text-align:left;
	}
#contents div.column p.leadtxt02 {
	margin: 0 0 12px 0;
	}
	
#contents div.column ul.btn_links {
	margin:18px 0 0 0;
	text-align: left;
	}
#contents div.column ul.btn_links li {
	display: inline;
	margin: 0 0 0 5px;
	padding: 0;
	}

#contents div.column ul.btn_links li a {
	padding: 4px 13px;
	}

}

@media handheld, only screen and (max-width: 468px) {

#contents div.column ul.btn_links li {
	display: block;
	margin: 10px 0 0 0;
	padding: 0;
	}

}




/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

���i���X�g�ݒ�

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
main .contactBtn a {
	display: block;
	padding: 15px 15px;
	font-size:18px;
	font-weight:  bold;
	color: #FFF !important;
	border-radius: 6px;
	background: #d61518;
	background: -webkit-gradient(linear, left top, left bottom, from(#d61518), to(#be1b1c));
    font-weight: bold;
    line-height: 1.1em;
    text-align: center;
	}
main .contactBtn a i { margin-left: 10px;}
main .contactBtn.mini a {
	display: inline-block;
	color: #FFF !important;
	padding: 10px 10px;
	background: #333;
	background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#333));
	font-size:14px;
	border-radius: 3px;
	}



main .block-products-pr [class*="flex-box"] {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    box-direction: normal;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    box-orient: horizontal;
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    -moz-flex-direction: row;
    flex-direction: row;
    -moz-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    box-sizing: border-box;
	}
main .block-products-pr {
	padding-top: 35px;
	padding-bottom: 35px;
	position:relative;
	background:#f5f5f5;
	border-top: #ccc 1px solid !important;
	}
/*===================================
base
===================================*/
main .block-products-pr .flex-box { margin-left: -1.33%;}
main .block-products-pr .flex-box li { margin-left: 1.33%; width: 100%; max-width: 48.67%;}
main .block-products-pr .flex-box li:nth-child(n+3) { margin-top: 5px;}
main .block-products-pr p + .flex-box { margin-top: 20px;}
main .block-products-pr p + .cat_btn,
main .block-products-pr .flex-box + .cat_btn { margin-top: 35px;}
/*===================================
font/img
===================================*/
main .block-products-pr img { width: auto; max-width: 100%;}
main .block-products-pr h2 { margin: 0 0 20px 0; font-size: 24px;}
main .block-products-pr h3 { margin: 0 0 15px 0; font-size: 17px;}
main .block-products-pr .flex-box + h3.otherTit { margin-top: 18px; padding-top: 18px; border-top : #eee solid 1px;}

main .block-products-pr .btn_block {
	margin: 18px auto 0 auto;
    padding: 18px 10% 0 10%;
    border-top: #eee solid 1px;
	}
/* font
-----------------------------------*/
main .block-products-pr .flex-box li { text-align: center;}
main .block-products-pr a:hover,
main .block-products-pr a:hover{ opacity: 0.7;}
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

min-width: 468px

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
@media screen and (min-width: 468px) {
/*===================================
base
===================================*/
main .block-products-pr .flex-box li:nth-child(n+3) { margin-top: 10px;}
/*===================================
font/img
===================================*/
main .block-products-pr h2 { margin: 0 0 30px 0; font-size: 30px;}
main .block-products-pr h3 { margin: 0 0 18px 0; font-size: 20px;}
main .block-products-pr .flex-box + h3.otherTit { margin-top: 20px; padding-top: 20px;}
main .block-products-pr .btn_block {
	margin-top: 20px;
	padding-top: 20px;
	}
}
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

min-width: 768px

::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
@media screen and (min-width: 768px) {
main .block-products-pr {
	padding-top: 60px;
	padding-bottom: 60px;
	position:relative;
	}
/*===================================
base
===================================*/
main .block-products-pr .flex-box li { width: 32.00333333%;}
main .block-products-pr .flex-box li:nth-child(n+3) { margin-top: 0;}
main .block-products-pr .flex-box li:nth-child(n+4) { margin-top: 15px;}
/*===================================
font/img
===================================*/
main .block-products-pr h2 { margin: 0 0 34px 0; font-size: 34px;}
main .block-products-pr h3 { margin: 0 0 20px 0; font-size: 22px;}
main .block-products-pr .flex-box + h3.otherTit { margin-top: 22px; padding-top: 22px;}
main .block-products-pr p + .cat_btn,
main .block-products-pr .flex-box + .cat_btn { margin-top: 50px;}
main .block-products-pr .btn_block {
	margin-top: 35px;
	padding-top: 25px;
	}
}




