@charset "utf-8";
 @import url("import.css");
/*
Theme Name: 
Author: Alma
Version: 1.0
*/

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　共通箇所
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
.sp {
	display: none;
}
html {
	background-color: #FFFFFF;
}
body {
	text-align: center;
	background-color: #FFFFFF;
	line-height: 1.6;
	font-family: Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	letter-spacing: 1px;
	font-size: 14px;
}
/* wrapper */
.wrapper {
	width: 1020px;
	margin: 0 auto;
	text-align: left;
}
.wrapper940 {
	width: 940px;
	margin: 0 auto;
	text-align: left;
}
.wrapper_inner {
	width: 960px;
	margin: 0 auto;
	text-align: left;
}
/* link */
a {
	color: #333;
	text-decoration: underline;
}
a:link {
	color: #333;
}
a:visited {
	color: #333;
}
a:hover {
	color: #f96c37;
	text-decoration: underline;
}
hr {
	border: 0;
	height: 1px;
	margin-bottom: 20px;
	background: #ccc;
	background-image: -webkit-linear-gradient(left, #eee, #ddd, #eee);
	background-image: -moz-linear-gradient(left, #eee, #ddd, #eee);
	background-image: -ms-linear-gradient(left, #eee, #ddd, #eee);
	background-image: -o-linear-gradient(left, #eee, #ddd, #eee);
}
/* header
----------------------------------------------------------------------------------------------------*/

header.global {
	padding-top: 15px;
	padding-bottom: 15px;
}
header.global h1 {
	width: 220px;
	float: left;
	padding-top: 3px;
}
header.global nav {
	float: right;
	width: 720px;
	text-align: right;
}
header.global nav ul {
}
header.global nav ul li {
	float: right;
}
header.global nav ul li a {
	padding: 15px 13px;
	display: block;
	background: url(images/nav_line.gif) no-repeat right 5px;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
header.global nav ul li a:hover {
	background: #f0f0f0 url(images/nav_line.gif) no-repeat right 5px;
	;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
header.global nav ul li.lang {
	padding: 15px 0 0 20px;
}
header.global nav ul li.lang img {
	position: relative;
	top: -2px;
}
header.global nav ul li.lang form{
	display:inline;
}
header.global nav ul li.lang select {
	font-size: 12px;
	padding: 2px 3px;
	margin-left: 5px;
	font-family: "Times New Roman", Times, serif;
}
/* contents
----------------------------------------------------------------------------------------------------*/
#main_contents {
	margin-bottom: 25px;
}
#contents {
	padding-top: 40px;
}
#contents h2 {
	margin-bottom: 50px;
}
#contents section {
	margin-bottom: 50px;
}
#contents section .message {
	width: 700px;
	margin: 0 auto 40px;
}
/* footer
----------------------------------------------------------------------------------------------------*/
.pagetop {
	clear: both;
	text-align: center;
	position: fixed;
	bottom: 0;
	right: 0;
}
.pagetop a {
	display: block;
}
.pagetop a:hover {
	display: block;
}
footer.global {
	clear: both;
	width: 100%;
	padding: 0px 0 15px;
}
footer.global .shadow {
	padding-bottom: 5px;
	line-height: 1;
}
footer.global nav {
	padding-top: 13px;
	margin-bottom: 20px;
}
footer.global nav ul {
	font-size: 12px;
	margin: 0 5px;
	text-align: center;
}
footer.global nav ul li {
	margin-right: 10px;
	border-right: 1px solid #ccc;
	padding-right: 14px;
	display: inline;
}
footer.global nav ul li:first-child {
	border-left: 1px solid #ccc;
	padding-left: 14px;
}
footer.global nav ul li a {
	text-decoration: none;
	color: #666 !important;
}
footer.global nav ul li a:hover {
	text-decoration: underline;
	color: #666 !important;
}
footer.global p.copy {
	text-align: center;
	clear: both;
	padding-top: 30px;
	color: #666;
	font-size: 11px;
}
/* subpage(下層ページ共通設定) 
----------------------------------------------------------------------------------------------------*/


/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　index.html
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
#index .youtube{
	margin-bottom:50px;
}
#index .youtube .wrapper{
	text-align:center;
}
#index .youtube iframe{
    width: 1020px;
    height: 570px;
}

#index .youtube{
	margin-bottom:20px;	
}
#index .youtube iframe{
    width: 1020px;
    height: 570px;
}

#index .youtube{
	margin-bottom:20px;
		padding-bottom:30px;
}
#index .youtube li{
	width:48%;	
	float:left;
	margin-bottom:4%;
}
#index .youtube li:nth-child(odd){
	margin-right:4%;
	
}
#index .youtube p{

	position:relative;
    width:100%;
    height:0;
    padding-top:56%;

}
#index .youtube iframe{
position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;	
}
#main_img {
	overflow: hidden;
}
#main_img .bx-wrapper {
	width: 1200px;
	margin: 0 auto 80px;
}
.bx-wrapper .bx-pager {
	position: absolute;
	bottom: 10px;
	left: 570px;
}
/* ラインナップ*/
#lineup_slide {
	width: 1200px;
	margin: 0 auto 90px;
}
#lineup_slide .btn {
	margin: 20px 0 0;
}
/* バナー */
section.product_banner {
	margin-bottom:70px !important;
}
section.product_banner p{
	margin-bottom:40px;
}
section.product_banner ul.col2 {
	_zoom: 1;
	overflow: hidden;
	margin-right: -30px;
	margin-bottom: 15px;
}
section.product_banner ul.col2 li {
	width: 460px;
	float: left;
	margin-right: 40px;
	margin-bottom: 30px;
}
section.product_banner ul.col2 li:nth-child(even){
	margin-right: 0;
}
section.product_banner ul.col2 li img{
	width: 100%;
	height: auto;
}
/*news*/
section.news {
	margin-bottom:50px !important;
}

section.news h2{
	margin-bottom:30px !important;
}

section.news dl{
	padding:15px 20px 13px;
	border-bottom:1px dashed #ccc;
}
section.news dl:last-child{
	xborder-bottom:1px dashed #ccc;	
}
section.news dl dt{
	width:120px;
	float:left;
	
}
section.news dl dd{
	width:800px;
	float:left;
}

/* SNS */
section.sns_area {
	background: #f3f3f3;
	padding: 50px 0;
}
section.sns_area .wrapper {
	background: #fff;
}
section.sns_area .wrapper_inner {
	padding: 30px 0;
}
section.sns_area h2 {
	margin-bottom: 30px !important;
}
section.sns_area h3 {
	margin-bottom: 25px;
}
section.sns_area .left, section.sns_area .right {
	width: 398px;
	float: left;
	margin-bottom: 20px;
}
section.sns_area .left {
	margin-right: 90px;
	margin-left: 30px;
}
section.sns_area .left p {
	margin-bottom: 20px;
}
section.sns_area .right h4 {
	margin-bottom: 15px;
}
section.sns_area ul li {
	display: inline;
	padding-right: 5px;
}
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　lineup.html
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
#lineup {
}
#lineup .lineup p{
	margin-bottom:30px;
}
#lineup .lineup .col2 p{
	width: 460px;
	margin-right: 40px;
	float: left;
}
#lineup .lineup .col2 p:last-child{
	margin-right: 0;	
}
#lineup .lineup .col2 p img{
	width: 100%;
	height: auto;
}
#lineup .lineup {
}
#lineup .lineup .title{
	margin-bottom:60px;
}
#lineup .lineup ul li {
	margin-bottom: 40px;
}
#lineup .catch{
	text-align:center;
}
#lineup .photo img{
	max-width:100%;
	height:auto;

}
#lineup .text{
	text-align:center;
	padding:0 20px 10px;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-size:28px;


}
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　onlineshop.html
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
#onlineshop {
}
#onlineshop .onlineshop h3 {
	margin-bottom: 25px;
	margin-left: 10px;
}
#onlineshop .onlineshop ul {
	margin-bottom: 70px;
	overflow: hidden;
	margin-right: -30px;
	margin-left: 70px;
}
#onlineshop .onlineshop ul li {
	float: left;
	margin-right: 30px;
}
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　company.html
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

#company section.aisatsu {
	margin-bottom: 50px;
}
#company section.aisatsu p {
	margin-bottom: 1em;
}
#company section.aisatsu .text {
	width: 500px;
	float: left;
}
#company section.aisatsu .photo {
	width: 310px;
	float: right;
	margin-right: 20px;
}
#company section table {
	border-top: 1px solid #dbdbdb;
	border-bottom: 1px solid #dbdbdb;
	margin: 10px auto 50px;
	width: 700px;
	font-size: 13px;
}
#company section table th {
	color: #000;
	padding: 18px 30px 15px;
	border-top: 1px solid #dbdbdb;
	border-bottom: 1px solid #dbdbdb;
	width: 130px;
	text-align: left;
	font-weight: bold;
	vertical-align: top;
}
#company table td {
	background: #fff;
	color: #000;
	padding: 18px 10px 15px;
	border-top: 1px solid #dbdbdb;
	border-bottom: 1px solid #dbdbdb;
}
#company table td p {
	margin-bottom: 10px;
}
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 access.html
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
#access #contents section p {
	margin-bottom: 20px;
	margin-left: 20px;
}
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　contact.html
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

#contact section p {
	margin-bottom: 20px;
}
#contact section table {
	border: 1px solid #9b9b9b;
	margin: 10px auto;
	font-size: 14px;
	width:650px;
}
#contact section table th {
	background: #f3f3f3;
	color: #000;
	padding: 9px 10px;
	border: 1px solid #ccc;
	width: 230px;
	text-align: right;
}
#contact section table td {
	background: #fff;
	color: #000;
	padding: 9px 15px;
	border: 1px solid #ccc;
}
#contact section table td p {
	margin-bottom: 10px;
}
#contact section input[type=submit] {
	border: none;
	width: 108px;
	height: 32px;
	padding: 0 3px;
	cursor: pointer;
	font-weight: bold;
	color: #fff;
	background: #666;
}
#contact section .submit_btn {
	text-align: center;
	margin: 20px 0 10px;
}
#contact section .submit_btn button,
.mfp_buttons button{
	background: #c0a657;
	color:#FFF;
	width: 120px;
	margin-right:20px;
	padding: 10px 20px;
	text-shadow:none;
	font-weight:normal;
	font-size:14px;
	border-radius:0;
	box-shadow:none;
}
#contact section .submit_btn button:hover,
.mfp_buttons button:hover{
	background: #a48833;
	box-shadow:none;
}

/* contact-confirm
----------------------------------------------------------------------------------------------------*/

#contact-confirm table {
	border: 1px solid #9b9b9b;
	margin: 0 20px;
	width: 640px;
}
#contact-confirm table th {
	background: #f2f2f2;
	color: #000;
	padding: 9px 10px;
	border: 1px solid #b4b4b4;
	width: 190px;
}
#contact-confirm table td {
	background: #fff;
	color: #000;
	padding: 9px 15px;
	border: 1px solid #9b9b9b;
}
/* contact-end
----------------------------------------------------------------------------------------------------*/

#contact-end #main_cont p {
	margin-bottom: 20px;
}
/* フォーム */
input[type="text"], textarea, select, div.styled, input[type="file"] {
	border-radius: 2px;
	border: solid 1px #ccc;
	padding: 4px 8px;
	font-size: 108%;
}
div.styled, select, #main_cont input[type="submit"], #main_cont input[type="button"], input[type="file"]:after {
	background: url(formelements-select.png) no-repeat center right;
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.1);
	box-shadow: 0 1px 3px rgba(0,0,0,0.1);
	font-size: 108%;
	padding: 5px 10px;
}
input[type="text"], textarea, input[type="file"] {
	xbackground-color: #f5f5f5;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.1);
	box-shadow: inset 0 1px 1px rgba(0,0,0,0.1);
	font-size: 108%;
}
.ie9 input[type="text"] {
	line-height: normal;
}
form .radio label {
	padding-right: 7px;
}
form .radio input[type="text"] {
	padding: 4px 4px;
	width: 30px;
	margin-right: 7px;
}
form .radio input[type="radio"] {
	margin-right: 3px;
}
#contact-confirm .contact_only {
	display: none;
}
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　thanks.html
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
#thanks .thanks h3{
	font-size:18px;
	text-align:center;
	margin-bottom:30px;
}
#thanks .thanks p{
	text-align:center;
}


/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
　privacy.html
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
#privacy section.privacy {
	width: 700px;
	margin: 0 auto 100px;
}
#privacy section p.h {
	font-size: 21px;
	margin-top: 50px;
	margin-bottom: 25px;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}



/* 北海道原料
-------------------------------------------------------------*/
section.ingredients .wrapper {
	width: 800px;padding: 0 0px;margin: 0 auto;text-align: left;
}

section.ingredients {
	margin-top:30px;
}
section.ingredients .headline {
	line-height:1.4;
	margin-bottom:30px;
	text-align:center;

}
section.ingredients .headline span.en{
	font-size:34px;
	    font-family: serif;	
	color:#bfa656;
}
section.ingredients .headline span.ja{
	color:#666;
	font-size:20px;	
}
section.ingredients .col {
	width: 33.3333%;
	float:left;
	text-align:center;
	margin-bottom:20px;
}
section.ingredients .col:nth-child(3n+1){
	clear:both;
}
section.ingredients .col .ja {
	margin-top:10px;
}
section.ingredients .col .en {
	margin-top:5px;
}
section.ingredients .col h3 {
	font-size:15px;
	margin:0;
	font-weight: normal;
	
	line-height:1.3;
}
section.ingredients .col p {
	font-size:15px;
	margin:0;
	line-height:1.3;
}
section.ingredients .col img {
	margin:0 auto;
	text-align:center;
	display: block;
}



/* company
-------------------------------------------------------------*/
#company section.brandstory{
	
	
}
#company section.brandstory ul li{
	margin-bottom:20px;
	float:left;
	width:48%;
	margin-bottom:2%;	
}
#company section.brandstory ul li:nth-child(odd){
		margin-right:4%;
}
#company section.brandstory ul li img{
	max-width:100%;
	height:auto;
}
#company section.brandstory .text{

}
#company section.brandstory .text p{
	margin-bottom:1em;

}
#company section.tenjikai{
	
}
#company section.tenjikai img{
	max-width:100%;
	height:auto;
	display:block;
	margin-bottom:5px;
}
#company section.tenjikai ul{
}
#company section.tenjikai ul li{
	float:left;
	width:49%;
	margin-bottom:2%;

}
#company section.tenjikai ul li:nth-child(odd){
		margin-right:2%;
}