/*==============================
main_image
==============================*/

body{
	z-index: 0;
    position: relative;
}
.main_image.pc{
	display:block;
}
.main_image.sp{
	display:none;
}
section.main_image{
	height: 50vw;
/* 	min-width: 960px; */
	background: url('../../files/img/main/mainimage01.png') no-repeat;
	background-size: contain;
	background-attachment: fixed;
	background-position: center top;
	z-index: -1;
}
section.main_image h2,
section.main_image h3{
    width: 960px;
	margin: 0 auto;
	text-align: center;
}
section.main_image h2 img{
	width: 308px;
	margin-top: 140px;
}
section.main_image h3 img{
	width: 499px;
}


/* イントロ ------------------------------------------ */
section.main_image .intro-logo1,
section.main_image .intro-logo2{
    width: 960px;
	margin: 0 auto;
	text-align: center;
}

.intro-logo-wrap{
	position: relative;
	z-index: 100;
}

/*商品大交流会バージョン--------*/

section.main_image .intro-logo1 img{
	width: 450px;
	margin-top: 260px;
}

section.main_image .intro-logo2 img{
	width: 300px;
}

@media screen and (max-width:768px){

section.main_image .intro-logo1 img{
	margin-top: 135px !important;
}

}
	
/*周年バージョン--------

section.main_image .intro-logo1 img{
	width: 500px;
}
section.main_image .intro-logo2 img{
	width: 300px;
}

通常バージョン--------

section.main_image .intro-logo1 img{
	width: 308px;
}
section.main_image .intro-logo2 img{
	width: 499px;
}

------------------------*/

.intro-logo-wrap{
	position: relative;
	z-index: 100;
}


.intro-logo1{
  z-index: 10;
  transform: scale(1);
  transition: filter 2s ease;
  filter: blur(100px);
	margin: 0 auto;
	text-align: center;
}
.intro-logo1.shows{
  transition-delay:2s;
  transform: scale(1);
  filter: blur(0px);
}

.intro-logo2{
  z-index: 10;
  transform: scale(0);
  transition: filter 3s ease;
  filter: blur(100px);
}
.intro-logo2.shows{
  transition-delay:0.4s;
  transform: scale(1);
  filter: blur(0px);
}
.intro-logo-wrap a{
	transition: 0.5s;
}
.intro-logo-wrap a:hover{
	opacity: 0.9;
}

/*==============================
navigation
==============================*/
.navigation{
	min-width: 960px;
	background: url('../img/design/navi_bg.png') repeat-x;
	background-size: 1600px;
	height: 124px;
    margin-top: -100px;
    display: block;
}
.navigation ul{
	width: 960px;
/*     min-width: 760px; */
    overflow: hidden;
    margin: 0 auto;
    padding-top: 6px;
}
.navigation ul li{
    float: left;
	width: 24.8%;
    text-align: center;
    border-left: 1px solid #D0CCC2;
    margin-top: 0px;
}
.navigation .kyomaru{
	margin: 0 auto;
	text-align: center;
}
.navigation .kyomaru img{
    margin-top: -49px;
    width: 55px;
}
.navigation ul a:nth-of-type(1) img{
	width: 138px;
}
.navigation ul a:nth-of-type(2) img,
.navigation ul a:nth-of-type(3) img{
	width: 118px;
}
.navigation ul a:nth-of-type(4) img{
	width: 158px;
}
.navigation ul a:nth-of-type(2) img{
	margin-top: 10px;
}
.navigation_sp{
	display: none;
}
.open_header{
	margin-top: -200px;
	transition: .3s;
	position: fixed;
}
.open_header.is-fixed{
	margin-top: 0px;
}

/*==============================
important_notices
==============================*/
.important_notices{
margin-bottom: 40px;
}
.important_notices_txt{
	background: #a70000;
	color: #fff;
	display: inline-block;
	padding: 2px 13px 0px;
	border-radius: 4px;
}
.important_notices_box{
display: block;
	padding-top: 5px;
    padding-bottom: 5px;
}
.important_notices a,
.important_notices a:hover{
	color:#a70000;
	text-decoration: none;
	font-weight: bold;

}
/*==============================
topics
==============================*/
.topics{
	width: 960px;
/* 	min-width: 760px; */
	margin: 0 auto;
	text-align: center;
	margin-bottom: 100px;
}
.topics h2 {
	margin-top: 50px;
}
.topics h2 img{
	width: 220px;
	margin-bottom: 10px;

}
.topics .topics_cards a{
	float: left;
}
.topics .topics_cards li{
	width: 465px;
	height: 140px;
	background: #fff;
	border-radius: 10px;
	float: left;
	color: #333333;
	box-shadow: 0 0 16px #ccc;
    overflow: hidden;
    margin-bottom:30px;
}
.topics .topics_cards a{
	margin-right: 15px;
}
.topics .topics_cards li .image_box{
	float: left;
    margin-top: -22px;
}
.topics .topics_cards li .image_box img{
    width: 253px;
    /* margin-left: -89px; */
    margin-top: 22px;
}
.topics .topics_cards li .text_box{
	text-align: left;
	overflow: hidden;
	padding: 8px 20px 8px 8px;
}
.topics .topics_cards li .text_box .title{
	/*margin-bottom: 5px;*/
	/*line-height: 1.4em;*/
	/* margin-bottom: 20px; */
}
.topics .topics_cards li .text_box .date{
    display: inline;
    font-size: 13px;
}
.topics .topics_cards li .topics_tag{
	float: right;
    /* border: 2px #ED6C00 solid; */
    /* border-radius: 15px; */
    font-size: 13px;
	/* padding: 2px 4px 0px 4px; */
    color: #ED6C00;
	/* font-weight: bold; */
	margin-right: 6px;
}
.topics ul.topics_tag_list{
	/* text-align: left; */
}
.topics ul.topics_tag_list a{
    text-decoration: none;
    color: #ED6C00;
}
.topics ul.topics_tag_list a:hover{
	background: #ED6C00;
	color: #fff !important;
}

.filter{
    cursor: pointer;
    text-decoration: none;
    border: 2px #ED6C00 solid;
    border-radius: 15px;
    font-size: 13px;
    padding: 2px 4px 0px 4px;
    color: #ED6C00;
    font-weight: bold;
    display: inline-block;
    margin: 5px;
}
.filter:hover{
    background: #ED6C00;
    color: #fff !important;
}
.topics_tag_list_outer{
    display: block;
    overflow: hidden;
    width: 100%;
}


.topics a .btn_topics:hover{
	opacity: 0.8;
}

.topics .btn_topics{
	width: 250px;
    height: 40px;
    background: #ED6C00;
    border-radius: 20px;
    margin: 0 auto;
    margin-top: 50px;
}
.topics .btn_topics img{
    width: 175px;
    margin: 4px 0 0 0px;
}

.topics .topics_cards li .text_box .date{
	color: #cccccc;
	display: block;
}


/*==============================
pickup_contents
==============================*/
.pickup_contents{
	color:#333333;
	background: url('../img/design/border.png') repeat-x top ;
	background-size: 1600px;
}
.pickup_contents p.copy{
    text-align: center;
    margin-top: 15px;
    font-size: 18px;
    width: 960px;
    margin: 0 auto;
    font-weight: bold;
}
.pickup_contents h2{
	text-align: center;
	margin-bottom: 15px;
}
.pickup_contents h2 img{
	width: 957px;
	margin-top: 130px;
}
.pickup_contents .slider01 img {
		max-width: 100%;
		height: auto;
	}
.pickup_contents .slider01 img {
		width: 600px;
	}


.pickup_contents h2 img.sp{
	display: none;
}
.pickup_contents .slider{
	width: 100%;
	min-width: 960px;
    z-index: 0;
    position: relative;
}


.pickup_contents .slider .slick-list li .text-box{
	padding: 30px 50px 0px 50px;
	height: 110px;
	background: #fff;
	color: #333;
}
.pickup_contents .slider .slick-list li .text-box,
.pickup_contents .slider .slick-list li .text-box:link{
	text-decoration: none !important;
}
.pickup_contents .slider .slick-list li .text-box p{
	width: 500px;
}

.pickup_contents .slider .slick-list li .text-box h3{
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 20px;
}

.pickup_contents .slider .slick-list a{
	margin: 20px;
	opacity: 0.6;
    box-shadow: 0 0 16px #ccc;
    border-radius: 10px;
    overflow: hidden;
    text-decoration: none;
}
.pickup_contents .slider .slick-list a.slick-current{
	opacity: 1;
}

/*==============================
child-raising
==============================*/
.child-raising{
	color:#333333;
	margin-top: 150px;
	background: url('../img/design/border.png') repeat-x top ;
	background-size: 1600px;
}
.child-raising p.copy{
    text-align: center;
    margin-top: 15px;
    font-size: 18px;
    width: 960px;
    margin: 0 auto;
    font-weight: bold;
}
.child-raising h2{
	text-align: center;
	margin-bottom: 15px;
}
.child-raising h2 img{
	width: 957px;
	margin-top: 130px;
}

.child-raising .slider{
	width: 100%;
	min-width: 960px;
    z-index: 0;
    position: relative;
}
.child-raising .slider01 img {
		width: 600px;
	}


.child-raising .slider .slick-list li .text-box{
	padding: 30px 50px 0px 50px;
	height: 110px;
	background: #fff;
	color: #333;
}
.child-raising .slider .slick-list li .text-box p{
	width: 500px;
}

.child-raising .slider .slick-list li .text-box h3{
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 20px;
}

.child-raising .slider .slick-list a{
	margin: 20px;
	opacity: 0.6;
    box-shadow: 0 0 16px #ccc;
    border-radius: 10px;
    overflow: hidden;
    text-decoration: none;
}
.child-raising .slider .slick-list a.slick-current{
	opacity: 1;
}
.child-raising h2 img.sp{
	display: none;
}

/*==============================
service
==============================*/
.service{
	color:#333333;
	margin-top: 150px;
	background: url('../img/design/border.png') repeat-x top ;
	background-size: 1600px;
}
.service p.copy{
    text-align: center;
    margin-top: 15px;
    font-size: 18px;
    width: 960px;
    margin: 0 auto;
    font-weight: bold;
}
.service h2{
	text-align: center;
	margin-bottom: 15px;
}
.service h2 img{
	width: 957px;
	margin-top: 130px;
}
.service h2 img.sp{
	display: none;
}
.service ul{
	margin: 0 auto;
	overflow: hidden;
    width: 970px;
    padding-top: 20px;
    padding-left: 5px;
}
.service ul a {
	border-radius: 10px;
}
.service ul li:hover{
	opacity: 0.8;
}
.service ul li{
	width: 225px;
	height: 225px;
    border-radius: 10px;
    overflow: hidden;
    display: inline-block;
    box-shadow: 0 0 16px #ccc;
    margin-top: 20px;
}
.service ul a li .illust img{
	width: 225px;
	text-align: center;
}
.service ul a li{
	margin-right: 15px;
}
.service ul a:nth-of-type(4) li,
.service ul a:nth-of-type(8) li,
.service ul a:nth-of-type(12) li{
	margin-right: 0px;
}
.service .sp{
	display: none;
}

/*==============================
footer
==============================*/
.footer{
	color:#333333;
	background: url('../img/design/border.png') repeat-x top ;
	background-size: 1600px;
}
.footer ul.footer_panel{
	overflow: hidden;
	margin: 0 auto;
	width: 960px;
    padding-top: 150px;
}
.footer ul.footer_panel li {
	width: 470px;
	height: 300px;
	float: left;
}
.footer ul.footer_panel a:nth-of-type(1) {
	margin-right: 20px;
	overflow: hidden;
    display: inline-block;
    float: left;
}
.footer ul.footer_panel li .bg{
	border-radius: 10px;
    overflow: hidden;
	background: #000;
	height: 300px;
}
.footer ul.footer_panel li p{
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ゴシックM-PRO","HGMaruGothicMPRO";
	font-size: 24px;
	position: relative;
}
.footer ul.footer_panel li img{
	width: 470px;
}
.footer ul.footer_panel li:hover img{
	opacity: 0.6;
}
.footer ul.footer_panel li p{
    margin-top: -155px;
    color: #fff;
    margin-left: 190px;
}

.footer .footer_share{
	overflow: hidden;
	margin: 0 auto;
	width: 960px;
	padding-top: 50px;
	text-align: center;
}
.footer .footer_share a:nth-of-type(1) img{
	width: 50px;

}
.footer .footer_share a:nth-of-type(2) img{
	width: 50px;
	margin-left: 32px;
}

.footer .footer_share a img{
	width: 50px;
}
.footer_panel_sp{
	display: none;
}
.footer_share a:hover img{
	opacity: 0.8;
}
/*==============================
footer
==============================*/
footer{
	font-size: 11px;
	color: #fff;
	margin-top: 50px;
	padding: 10px 0;
	margin: 0 auto;
	text-align: center;
	margin-top: 50px;
}
footer p{
	color:#fff;
}


/*==============================
slick
==============================*/

.slick-prev::before,
.slick-next::before{
	content: '';
}

.slick-prev,
.slick-prev:hover{
	z-index: 1;
    background: url(../img/slick/prev_btn.png) no-repeat;
    background-size: cover;
    width: 60px;
    height: 60px;
    position: relative;
    top: 250px;
    right: 400px;
    display: block;
    margin: 0 auto;
}
.slick-next,
.slick-next:hover{
/* 	z-index: 1; */
    background: url('../img/slick/next_btn.png') no-repeat;
    background-size: cover;
    width: 60px;
    height: 60px;
    position: relative;
    left: 400px;
    display: block;
    margin: 0 auto;
    top: -290px;
}
.slick-next:hover,
.slick-prev:hover{
	opacity: 0.8;
}
.slick-dots li button {
    font-size: 0;
    line-height: 0;
    padding: 5px;
    cursor: pointer;
    outline: none;
    background: transparent;
    border: 2px solid #ED6C00;
    border-radius: 50%;
}
.slick-dots li.slick-active button{
	background: #ED6C00;
}

/*===================================
121807追記 年末年始お知らせ
===================================*/
.oshirase{
	text-align: center;
	margin: 75px auto 0px;
}

.oshirase img{
	width: 500px;
	height: 80px;
}






/*===================================
responsive
===================================*/

@media screen and (max-width:768px){
	.main_image.pc{
		display:none;
	}
	.main_image.sp{
		display:block;
	}
	section.main_image{
		width: 100%;
		min-width: 0;
		/* margin-top: 158px; */
		height: 500px !important;
	}
	section.main_image h2, section.main_image h3{
		width: 100%;
	}
	section.main_image h3 img{
		width: 80%;
	}
	section.main_image .intro-logo1,
	section.main_image .intro-logo2{
    width: 100%;
}
	section.main_image .intro-logo1 img{
		width: 80%;
	}
	section.main_image .intro-logo2 img{
		width: 80%;
	}
	.navigation{
		display: none;
	}
	.navigation_sp{
		width: 100%;
	    display: block;
	    background: url(../../common/files/img/sp/navi_bg.png) no-repeat;
	    background-size: cover;
	    margin-top: -36%;
	    background-position: 0px -6vw;
	}
	.navigation_sp p.kyomaru{
		text-align: center;
	}
	.navigation_sp p.kyomaru img{
		width: 12%;
	}
	.navigation_sp ul{
		overflow: hidden;
	}
	.navigation_sp ul li{
		float: left;
		width: 24.2%;
	}
	.navigation_sp ul a:nth-of-type(1) li{
		border-left:0;
	}
	.navigation_sp ul li{
		border-left: 1px solid #D0CCC2;
	}
	.navigation_sp ul li img{
		width: 49%;
		margin-left: 25%;
	}
	.navigation_sp .border img{
		width: 100%;
	}
	section.main_image h2 img{
		margin-top: 135px;
	}
	.site_header_inner.sp{
		top:-100px;
	}
	.site_header_inner.sp.is-fixed{
		top:0px;
	}
	.oshirase img{
		width: 80%;
		height:auto;
	}

/*==============================
important_notices
==============================*/
.important_notices{
	margin-bottom: 20px;
}
.important_notices_box{
	display: block;
	margin-bottom: 10px;
}



	.topics{
		width: 100%;
	}
	.topics .btn_topics{
		width: 140px;
		height:30px;
		margin-top: 30px;
	}
	.topics .btn_topics img{
		width: 120px;
		margin: 4px 0 0 0px;
	}

	.topics .topics_cards li{
		width: 96%;
		margin-left: 2%;
		margin-bottom:10px;
	}
    .topics h2{
        margin-top: 50px;
    }
	.pickup_contents h2 img.pc{
		display: none;
	}
	.pickup_contents h2 img.sp{
		width: 90%;
		display: block;
		padding-top: 21%;
		margin-left: 5%;
		margin-top: 0px;
	}
	.pickup_contents p.copy{
		width: 100%;
		font-size: 14px;
	}
	.pickup_contents .slider{
		min-width: 0;
	}
	.pickup_contents .slider01 img {
			width: 100%;
		}
	.pickup_contents .slider .slick-list li .text-box {
	    padding: 30px 30px 20px 30px;
	    height: auto;
	}
	.pickup_contents .slider .slick-list li .text-box h3{
		font-size: 15px;
	}
	.pickup_contents .slider .slick-list li .text-box p{
	width: 100%;
	font-size: 13px;
	}

	.child-raising p.copy{
		width: 100%;
		font-size: 14px;
	}
	.child-raising .slider{
		min-width: 0;
	}

	.child-raising .slider01 img {
			width: 100%;
		}
	.child-raising .slider .slick-list li .text-box p{
	width: 100%;
	}

	.child-raising h2 img.pc{
		display: none;
	}
	.child-raising h2 img.sp{
		width: 90%;
		display: block;
		padding-top: 21%;
		margin-left: 5%;
	}
	.child-raising .slider .slick-list li .text-box h3{
		font-size: 15px;
	}
	.child-raising .slider .slick-list li .text-box {
	    padding: 30px 30px 20px 30px;
	    height: auto;
	}
	.child-raising .slider .slick-list li .text-box p{
	width: 100%;
	font-size: 13px;
	}

	.service h2 img.pc{
		display: none;
	}
	.service h2 img.sp{
		width: 90%;
		display: block;
	    padding-top: 21%;
	    margin-left: 5%;
	}
	.footer ul.footer_panel a{
		margin: 5%;
	}
	.footer ul.footer_panel li{
		width: 100%;
		height: auto;
	}
	.footer ul.footer_panel li img{
		width: 100%;
	}
	.service ul{
		padding-left: 0;
		width: 100%;
	}
	.service ul li{
		width: 30%;
		box-shadow: none;
		margin: 1.8%;
	}
	.service ul a li .illust img{
	    width: 100%;
	}
	.service ul a li{
		margin-right: 0px;
	}
	.service .pc{
	display: none;
	}
	.service .sp{
	display: block;
	}
	.service ul li{
		height: auto;
	}
	.topics .topics_cards a:nth-child(odd){
		margin-right: 0px;
	}

	.topics .topics_cards li{
		height: auto;
		font-size: 13px;
	}
    .topics .topics_cards li .image_box {
        float: left;
        width: 50%;
        overflow: hidden;
    }
    .topics .topics_cards li .image_box img {
        width: 130%;
        /* margin-bottom: -5.7%; */
	}
	.topics .topics_cards li .text_box {
	    padding: 10px;
	}
	.topics .topics_cards li .text_box .date{
		color: #cccccc;
	}
	.topics .topics_tag_list_outer{
		-webkit-overflow-scrolling: touch;
		overflow-x: auto;
		width: 100%;
		padding-top: 20px;
	}
	.topics ul.topics_tag_list{
		/* text-align: left; */
		display: table;
		list-style: none;
		/* width: 1100px; */
	}
	.topics ul.topics_tag_list a{
	    position: relative;
	    white-space: nowrap;
	    list-style: none;
	}
	.topics .topics_cards a{
		width: 100%;
	}

	.child-raising{
		margin-top: 0px;
	}

	.footer{
		margin-top: 50px;
	    padding-top: 70px;
	}
	.footer .footer_share{
		width: 100%;
	}
	.footer .footer_panel{
		width: 100%;
		padding-top: 60px;
	}
	.footer .footer_panel li img{
		height: auto;
	}
	.footer_panel_sp{
		display: block;
	}
	.footer_panel_sp li img{
	    width: 90%;
	    margin: 2% 5%;
	}
	.footer ul.pc{
		display: none;
	}
	.footer .footer_share{
		text-align: center;
		overflow: hidden;
		margin: 0 auto;
	}
	.footer .footer_share a:nth-of-type(1) img{
		margin-left: 0;
	}
	.footer .footer_share a:nth-of-type(2) img {
	    top: 3px;
	    position: relative;
	}

	.footer .footer_share a {
	    display: contents;
	}

	footer{
		padding-bottom: 100px;
	}
	footer p{
		padding: 0 10px;
	}
	#page-top{
		display: none !important;
	}
}



/*===================================
ipad
===================================*/

@media screen and (width:768px){
.topics .topics_cards li .image_box img{
	width: 101%;
}
.topics .topics_cards li .text_box{
	margin-top: 40px;
}
.slick-dots{
    top: 580px;
}
.child-raising h2 img.sp,
.pickup_contents h2 img.sp,
.service h2 img.sp{
	padding-top: 12%;
}
.site_header_inner.sp {
    top: -200px;
}
.site_header_inner.sp {
    margin-top: 0px !important;
}
footer {
    padding-bottom: 160px;
}
}
@media screen and (min-width: 600px) and (max-width: 768px){
	.intro-logo-wrap{
		width: 80%;
		margin-left: 10%;
	}
}