@charset "utf-8";

/* about */

.policy-wrap {
/*	background-image:url("../images/about/milk_bg.jpg");*/
	background-repeat: no-repeat;
	background-position: center top;
}
.policy-wrap .page-maintxt {
	color:#009cde;
	margin-bottom:20px;
	padding-top:10px;
}
.policy-wrap .merit-wrap {
	/*background-color: #deecfe;*/
	padding-bottom:20px;
	padding-top:0px;
	margin-bottom:60px;
	position: relative;
	border-bottom: dotted 2px #cccccc;
}
.policy-wrap .merit-wrap:before {
	display: block;
	content: ' ';
	width:100%;
	height:30px;
	/*background-image: url("../images/company/merit_bg.png");
	background-position: top center;
	position: absolute;
	top:-30px;*/
}
.policy-wrap .merit {
	padding:20px 0;
	margin-bottom:50px;
	background-color: #fff;
    border-radius: 120px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
	border:solid 5px #58a82f;
}
.policy-wrap .merit .number {
	float:left;	
	margin-top:-50px;
	padding-top:10px;
}
.policy-wrap .merit:after {
  content: "."; 
  display: block; 
  height: 0; 
  font-size:0;	
  clear: both; 
  visibility:hidden;
}
.policy-wrap .merit .number span {
	display: block;
	font-size:4.0rem;
	font-weight:bold;
	line-height: 52px;
}
.policy-wrap .merit .txt {
	width:520px;
	float:left;
	margin-left:20px;
}
.policy-wrap .merit .txt h3 {
	font-size:1.3rem;
	margin-bottom:20px;
	border-bottom:dotted 3px #58a82f;
	line-height:1.2;
	padding-bottom:10px;
}
.policy-wrap .merit .photo {
	float:right;
	width:180px;
	margin-right:20px;
}
@media screen and (min-width:768px) and ( max-width:991px) {
.policy-wrap .merit .photo {
	display: none;
}
}
@media (max-width: 767px) {
.policy-wrap {
background-image:none;
}
.policy-wrap .main-contents {
padding-bottom:60px;
}
.policy-wrap .main-contents br {
display: none;
}
.policy-wrap .merit-wrap:before {
margin-left:-15px;
}
.policy-wrap .merit-wrap {
padding-right:15px;
padding-left:15px;
}
.policy-wrap .merit .txt {
	width:100%;
	float:none;
	padding:0 15px 15px;
	margin-left:0px;
}
.policy-wrap .merit .number {
	position: absolute;
	left:50%;
	margin-left:-75px;
}
.policy-wrap .merit .txt h3 {
	font-size:1.2rem;
	margin-top:120px;
	padding-bottom:10px;
}
.policy-wrap .merit .photo {
	float:none;
	width:100%;
	padding:15px;
}
}
/* advice */

.advice-wrap {

}
.advice-wrap .page-maintxt {
	text-align: center;
}
.advice-wrap .advice-inner {
	background-color: #fcedf0;
	padding-bottom:100px;
	padding-top:50px;
	position: relative;
}
.advice-wrap .advice-inner:before {
	display: block;
	content: ' ';
	width:100%;
	height:30px;
	background-image: url("../images/about/advice_bg.png");
	background-position: top center;
	position: absolute;
	top:-30px;
}
.advice-wrap .generation {
	padding:20px 0;
	margin-bottom:50px;
	background-color: #fff;
    border-radius: 120px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}
.advice-wrap .generation h1 {
	margin-top:-60px;
	padding-top:10px;
	text-align: center;
}
.advice-wrap .generation h1 span {
	display: inline-block;
	padding:10px 40px;
	font-size:1.8rem;
	background-color: #009cde;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
	color:#fff;
}
.advice-wrap .generation:after {
  content: "."; 
  display: block; 
  height: 0; 
  font-size:0;	
  clear: both; 
  visibility:hidden;
}
.advice-wrap .generation .txt {
	width:680px;
	float:left;
	margin-left:30px;
}
.advice-wrap .generation .txt h2 {
	color:#F8A134;
	font-size:1.4rem;
	font-weight: bold;
	border-bottom:dotted 2px #ccc;
	padding:10px 0;
	margin-top:15px;
	margin-bottom:5px;
}
.advice-wrap .generation .txt h2:before {
    font-family: FontAwesome;
    content: '\f0a4';
    margin-right: 8px;
}
.advice-wrap .generation .photo {
	float:right;
	width:250px;
	margin-right:20px;
}
.advice-wrap .generation .photo img {
	margin-top:15px;
}
@media screen and (min-width:768px) and ( max-width:991px) {
.advice-wrap .generation .photo {
	display: none;
}
}
@media (max-width: 767px) {
.advice-wrap {
background-image:none;
}
.advice-wrap .main-contents {
padding-bottom:60px;
}
.advice-wrap .main-contents br {
display: none;
}
.advice-wrap .advice-inner:before {
margin-left:-15px;
}
.advice-wrap .advice-inner {
padding-right:15px;
padding-left:15px;
}
.advice-wrap .generation .txt {
	width:100%;
	float:none;
	padding:0 15px 15px;
	margin-left:0px;
}
.advice-wrap .generation .txt h1 {
	font-size:1.2rem;
	margin-top:120px;
	padding-bottom:10px;
}
.advice-wrap .generation .photo {
	float:none;
	width:100%;
	padding:15px;
}
}
/* flow */

.flow-wrap .flow-step ul {
	text-align: center;
}
.flow-wrap .flow-step li {
	float:left;
	width:33.3333%;
	padding-right:15px;
	padding-left:15px;
	text-align: center;
}

.flow-wrap .flow-step li span {
	display: block;
	margin:10px auto ;
	width:90%;
	text-align: left;
	
}
.flow-wrap .flow-step li span a {
    color: #009cde;
    font-weight: bold;
	display: inline-block;
	margin-top:10px;
}
.flow-wrap .about-howto {
/*	background-color: #deecfe;*/
	padding:50px 0;
	margin-top:10px;
	margin-bottom:40px;
	border-bottom: dotted 2px #cccccc;
}
.flow-wrap .about-howto .photo {
	float:left;
	width:40%;
	padding-right:15px;
	padding-left:15px;
}
.flow-wrap .about-howto .photo img {
	margin-top:5px;
}
.flow-wrap .about-howto dl {
	/*float:left;
	width:60%;*/
	padding:20px;
	background-color: #FBFCED;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}
.flow-wrap .about-howto dt {
	font-size:1.4rem;
/*	background-color: #ffffff;*/
	margin-bottom:8px;
	padding:5px;
}
.flow-wrap .about-howto dt:before {
    font-family: FontAwesome;
    content: '\f138';
    margin-right: 8px;
    color: #66cc33;

}
.flow-wrap .about-howto dd {
	margin-bottom:20px;
	padding:5px;
}
.flow-wrap .about-return ol {
	text-align: center;
	padding-bottom:100px;
}
.flow-wrap .about-return li {
	float:left;
	width:33.3333%;
	padding-right:15px;
	padding-left:15px;

}

.flow-wrap .about-return li span {
	display: block;
	margin:10px auto ;
	width:90%;
	text-align: left;
}
.delivery-area {
	text-align: center;
}
.delivery-area h2 {
	background-color: #66cc33;
	color:#fff;
	display: inline-block;
	color:#fff;
	padding:5px 30px;
	font-size:1.8rem;
	margin:0 auto;
}
.delivery-area div.delivery-wrap {
	/*background-color:#FBFCED;*/
	padding:30px;
	margin-bottom:80px;
	border:solid 3px #66cc33;
	text-align: left;
	overflow: hidden;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}

.delivery-area p {
	margin-top:20px;
}
.delivery-area .area {
	border-top:solid 1px #ccc;
	border-bottom:solid 1px #ccc;
	padding-top:10px;
	padding-bottom:10px;
}
@media (min-width: 992px) {
.delivery-area .photo {
	float:left;
	width:400px;
}
.delivery-area .txt {
	float:right;	
	width:500px;
}
}
@media (max-width: 767px) {
.flow-wrap .flow-step li {
	float:none;
	width:100%;
	margin-bottom:25px;
}	
.flow-wrap .about-howto {
	padding:40px 0;
	margin-top:20px;
	margin-bottom:20px;
}
	.flow-wrap .about-howto {
/*
		margin-right:-15px;
		margin-left:-15px;
*/
	}
	.flow-wrap .about-howto h2 {
		font-size:1.8rem;
		margin-bottom:20px;
	}
	.flow-wrap .about-howto .photo {
	float:none;
	width:100%;
	padding:15px 30px;
}
.flow-wrap .about-howto dl {
	float:none;
	width:100%;
	padding:15px 30px;
}
.delivery-area h2 {
	font-size:1.2rem;
}
}


/* guide order */

.guide-wrap {
/*	background-image:url("../images/about/milk_bg.jpg");*/
	background-repeat: no-repeat;
	background-position: center top;
}
.guide-wrap .page-maintxt {
	color:#009cde;
	/*margin-bottom:20px;*/
	padding-top:10px;
}
.guide-wrap .order-wrap {
	padding-bottom:20px;
	margin-top:-20px;
	position: relative;
	border-bottom: dotted 2px #cccccc;
}
.guide-wrap .order-wrap:before {
	display: block;
	content: ' ';
	width:100%;
	height:30px;
}
.guide-wrap .order {
	padding:20px 0;
	margin-bottom:50px;
	background-color: #fff;
    border-radius: 120px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
	border:solid 5px #58a82f;
}
.guide-wrap .order .number {
	float:left;	
	margin-top:-50px;
	padding-top:10px;
}
.guide-wrap .order:after {
  content: "."; 
  display: block; 
  height: 0; 
  font-size:0;	
  clear: both; 
  visibility:hidden;
}
.guide-wrap .order .number span {
	display: block;
	font-size:4.0rem;
	font-weight:bold;
	line-height: 52px;
}
.guide-wrap .order .txt {
	width:560px;
	float:left;
	
	margin-left:20px;
}
.guide-wrap .order .txt h3 {
	font-size:1.4rem;
	margin-bottom:20px;
	border-bottom:dotted 1px#58a82f;
	line-height:1.2;
	padding-bottom:10px;
}
.guide-wrap .order .photo {
	/*float:right;
	width:250px;
	margin-right:20px;*/
}
@media screen and (min-width:768px) and ( max-width:991px) {
.guide-wrap .order .photo {
	display: none;
}
}
@media (max-width: 767px) {
.guide-wrap {
background-image:none;
}
.guide-wrap .main-contents {
padding-bottom:60px;
}
.guide-wrap .main-contents br {
display: none;
}
.guide-wrap .order-wrap:before {
margin-left:-15px;
}
.guide-wrap .order-wrap {
padding-right:15px;
padding-left:15px;
}
.guide-wrap .order .txt {
	width:100%;
	float:none;
	padding:0 15px 15px;
	margin-left:0px;
}
.guide-wrap .order .number {
	position: absolute;
	left:50%;
	margin-left:-75px;
}
.guide-wrap .order .txt h3 {
	font-size:1.2rem;
	margin-top:120px;
	padding-bottom:10px;
}
.guide-wrap .order .photo {
	float:none;
	width:100%;
	padding:15px;
}
}



/* guide sample */
.guide-wrap .sample-wrap {
	padding-bottom:100px;
	padding-top:50px;
	position: relative;
}
.guide-wrap .sample-wrap:before {
	display: block;
	content: ' ';
	width:100%;
	height:30px;
}
.guide-wrap .sample {
	padding:20px 0;
	margin-bottom:50px;
	background-color: #fff;
    border-radius: 120px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
	border:solid 5px #00cf00;
}
.guide-wrap .sample .number {
	float:left;	
	margin-top:-50px;
	padding-top:10px;
}
.guide-wrap .sample:after {
  content: "."; 
  display: block; 
  height: 0; 
  font-size:0;	
  clear: both; 
  visibility:hidden;
}
.guide-wrap .sample .number span {
	display: block;
	font-size:4.0rem;
	font-weight:bold;
	line-height: 52px;
}
.guide-wrap .sample .txt {
	width:800px;
	float:left;
	margin-left:20px;
}
.guide-wrap .sample .txt h1 {
	font-size:1.8rem;
	margin-bottom:20px;
	border-bottom:dotted 3px #00cf00;
	line-height:1.2;
	padding-bottom:10px;
}
.guide-wrap .sample .photo {
	float:right;
	width:250px;
	margin-right:20px;
}
@media screen and (min-width:768px) and ( max-width:991px) {
.guide-wrap .sample .photo {
	display: none;
}
}
@media (max-width: 767px) {
.guide-wrap .sample-wrap:before {
margin-left:-15px;
}
.guide-wrap .sample-wrap {
padding-right:15px;
padding-left:15px;
}
.guide-wrap .sample .txt {
	width:100%;
	float:none;
	padding:0 15px 15px;
	margin-left:0px;
}
.guide-wrap .sample .number {
	position: absolute;
	left:50%;
	margin-left:-75px;
}
.guide-wrap .sample .txt h1 {
	font-size:1.2rem;
	margin-top:120px;
	padding-bottom:10px;
}
.guide-wrap .sample .photo {
	float:none;
	width:100%;
	padding:15px;
}
}




/* use */
.use-wrap {
	background-image:url("/images/guide/guide_bg.jpg");
	background-size:cover;
	padding-bottom:150px;
}
.use-wrap article {
	float:left;
	width:33.3333%;
	padding-right:15px;
	padding-left:15px;
}
.use-wrap .use-main {
	text-align: center;
	background-size:cover;
	padding-top:100px;
	padding-bottom:100px;
}
.use-wrap .use-main h2 {
	font-size:2.0em;
	color:#58a82f;
	font-weight: 700;
  text-shadow: 2px 2px 0px #fff;
}
.use-wrap .use-main p {
	font-size:1.4rem;
	margin-top:20px;

}
.use-wrap .use-menu {
	background-color: #fff;
	padding:30px 30px 0 30px;
	box-shadow: 0 0 8px #ccc;
}
.use-wrap .use-menu h2.main-title {
	margin-top:-60px;
}
.use-wrap .use-menu h2.main-title span {
	color:#fff;
	font-size:1.8rem;
	background-color: #58a82f;
	display:inline-block;
	padding:8px 40px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}
.use-wrap .use-menu .main-title {
	color:#58a82f;
	font-size:1.4rem;
	text-align: center;
	margin-bottom:30px;
}
.use-wrap .use-menu article {
	margin-bottom:30px;
}
.use-wrap .use-menu article a {
	border:solid 1px #dfff;
	display: block;
}
.use-wrap .use-menu article a:hover {
	border:solid 1px #58a82f;

}
.use-wrap .use-menu article h1 {
	background-color: #009cde;
	color:#fff;
	text-align: center;
	font-size:1.2rem;
	padding:10px 0;
}
.use-wrap .use-menu article a:hover h1 {
	background-color: #58a82f;
}
.use-wrap .use-menu h1:after {
	font-family: FontAwesome;
	content: '\f138';
	margin-left:15px;		
}
.use-wrap .use-menu article p {
	background-color: #fffac6;
	padding:10px;
}

@media screen and (min-width:768px) and ( max-width:991px) {
.use-wrap .use-main {
	padding-bottom:50px;
}
.use-wrap .use-main h2 {
	font-size:1.8em;
}	
.use-wrap .use-menu article h1 {
	font-size:1.0rem;
}
.use-wrap .voice-wrap .voice-txt {
	width:380px;
}
}
@media (max-width: 767px) {
.use-wrap .use-main h2 {
	font-size:1.0em;
}    
	.use-wrap .use-main {
	padding:15px 15px 60px 15px;
	}
	.use-wrap .use-main br {
		display: none;
	}
.use-wrap .use-menu {
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
}
.use-wrap article {
    width: 100%;
	float:none;
}

.use-wrap .use-menu h2.main-title span {
	font-size:1.2rem;
	padding:8px 20px;
}
.use-wrap .voice-wrap img {
	float:none;
}
.use-wrap .voice-wrap .voice-txt {
	width:100%;
	margin-top:10px;
}
}






/*   **********その他の特徴**********　 　*/
.secContent01{
padding:40px 0;
background:#fcf9eb;
}

.sectionIn {
margin: 0 auto;
width: 1000px;
text-align: left;
}


@media screen and (max-width: 767px) {
.sectionIn {
width: 100%;
padding: 0 15px;
box-sizing: border-box;
}

}


#sec05{}
#sec05In{
padding:0 30px;
}
#sec05 .title{
margin:-73px auto 58px;
width:417px;
}
#sec05 .title .ttl{
position:relative;
display:block;
padding:20px 0;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
background-color:#fc555f;
text-align:center;
}
#sec05 .title .ttl:before{
content:'';
position:absolute;
left:50%;
bottom:-30px;
margin-left:-10px;
width:20px;
height:30px;
background: url(/images/about/ico_arrow07.png) no-repeat 0 0;
background-size:20px auto;
}
#sec05 .title h3 img{
width:auto;
height:26px;
}
#sec05 ul{
overflow:hidden;
margin-bottom:40px;
}
#sec05 li{
float:left;
width:33%;
padding:35px 0;
box-sizing:border-box;
border-top:1px solid #ccc;
}
#sec05 li:nth-child(1),
#sec05 li:nth-child(2),
#sec05 li:nth-child(3){
border-top:none;
padding-top:18px;
}
#sec05 li:nth-child(1),
#sec05 li:nth-child(2)
{
padding:15px;
/*border-right:1px solid #ccc;*/
}
#sec05 li:nth-child(3){
padding:15px;
}
#sec05 li .ttl{
margin-bottom:22px;
font-size:22px;
color:#0072bf;
font-weight:bold;
line-height:1.4;
text-align:center;
}
#sec05 li .figure{
width:186px;
margin:0 auto 20px;
min-height: 90px;
}
#sec05 li:nth-child(1) .figure,
#sec05 li:nth-child(2) .figure, 
#sec05 li:nth-child(3) .figure{
min-height: 114px;
}

#sec05 li .figure img{
width:100%;
height:auto;
}
#sec05 li .txt{
font-size:16px;
line-height:1.75;
letter-spacing: -0.5px;
}
#sec05 li a{
margin:24px 0 5px;
}
#sec05 .btn{
width:405px;
margin:0 auto;
}


@media screen and (max-width: 767px) {
#sec05{}
#sec05 .sectionIn,
#sec05In{
padding:0;
}
#sec05 .title{
padding:0 15px;
margin:-42px auto 16px;
width:100%;
box-sizing:border-box;
}
#sec05 .title .ttl{
padding:15px 0;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#sec05 .title .ttl:before{
bottom:-20px;
width:14px;
height:20px;
margin-left:-7px;
background-size:14px auto;
}
#sec05 .title h3 img{
height:18px;
}
#sec05 ul{
padding:0;
margin-bottom:25px;
}
#sec05 li{
float:none;
width:100%;
padding:21px 33px 25px;
border-top:none;
border-bottom:1px solid #ccc;
}
#sec05 li:nth-child(1),
#sec05 li:nth-child(2),
#sec05 li:nth-child(3){
border-top:none;
padding-top:21px;
}
#sec05 li:nth-child(1),
#sec05 li:nth-child(2){
padding-right:15px;
border-right:none;
}
#sec05 li:nth-child(3){
padding:15px;
}
#sec05 li .ttl{
margin-bottom:15px;
font-size: 17px;
}
#sec05 li .figure{
width:193px;
min-height: 80px;
margin:0 auto 16px;
}
#sec05 li .figure img{
width:100%;
height:auto;
}
#sec05 li .txt{
font-size: 15px;
}
#sec05 li a{
margin:24px 0 5px;
}
#sec05 .btn{
width:100%;
padding:0 18px;
box-sizing:border-box;
}


}