@charset "utf-8";

/* ===================================================================
font size default 16px
		10px  	63%			19px 	119%
		11px 	69%			20px 	125%
		12px 	75%			21px 	131%
		13px 	81%			22px 	138%
		14px 	88%			23px 	144%
		15px 	94%			24px 	150%
		16px 	100%		25px 	156%
		17px 	106%		26px 	163%
		18px 	113%		27px	169%
=================================================================== */

/* ================================================================
		common
================================================================ */
@media screen and (min-width:1024px) { 
.sp { display:none; }
#contents {
	width:100%;
}
}

#contents {
	font-size:131%;
	line-height:1.6;
}

#header {
	margin:20px auto 15px;
	text-align:center;
}

#header h1#logo {
	margin:0 auto;
	text-align:center;
}

#header h1#logo img {
	width:151px;
}

#header h2 {
	font-size:124%;
}

#header h2 a {
	color:#333;
	text-decoration:none;
}

#main p img {
	max-width: 100%;
	margin: 0 auto;
	height: inherit;
}

#footer, .fixity #footer_nav {
	max-width: 1000px;
	/* width:100%; */
	margin: 0 auto;
}

.fixity #notice_containe .notice_text, .fixity #htop_container #htop, .fixity #head_container #head, .fixity #htop, .fixity #center_container #center_content, .fixity #footer, .fixity #footer_nav {
	width:100%;
	max-width: 1000px;
	margin: 0 auto;
}

/* フッター赤い部分の設定 */
#footer_nav ul {
	max-width: 1000px;
	width:100%;
	margin: 0 auto 15px;
	text-align: center;
}

/* 商品を見るボタン */
.special_btn {
	margin:40px auto;
}

.product_view {
	background:url(../images/common/special_btn.png) 0 0 no-repeat;
}

p.product_view {
	position:relative;
	left:-4px;
	width:350px;
	height:80px;
	line-height:80px;
	text-align:center;
	font-weight:bold;
	margin:0 auto;
	font-size:177% !important;
}

p.product_view:hover {
	background:url(../images/common/special_btn.png) 0 -80px no-repeat;
}

p.product_view a {
	text-decoration: none;
	display: block;
	zoom: 1;
	height: 80px;
	line-height: 80px;
	background: url(../images/common/special_btn.png) right 0 no-repeat;
	position: relative;
	right: -8px;
	padding-right: 4px;
	color: #555;
	background-image: url(../images/common/special_btn.png);
}

p.product_view a:visited,
p.product_view a:hover {
		background:url(../images/common/special_btn.png) 0 -80px no-repeat;
}

p.product_view:hover a,
p.product_view a:hover {
	background:url(../images/common/special_btn.png) right -80px no-repeat;
}

.special_btn_icon {
	position:relative;
	margin-left:8px;
	top:2px;
}

.fl { float:left; }
.fr { float:right; }

.ALright { text-align:right !important; }

.out_link {
	background:url(../../../common/images/site_dropdown_icon_arrow.gif) 0 10px no-repeat;
	padding-left:15px;
}

.disc li {
	list-style: disc;
	margin-left: 1.5em;
}

/* はがきの並び設定 */


/* 画像ロールオーバー */

 
 @media screen and (max-width:1000px) { 
.sp { display:none; }
.sp_only { display:none; }
 /* フッター設定 */
#footer, .fixity #footer_nav {
	/* width:100%; */
	width: 94.7916666667% !important;
	max-width:1000px;
}

.f_head {
	margin-bottom: 15px;
}

.f_sitename {
	float:none;
	font-weight: bold;
	font-size: 138.5%;
	margin-bottom:15px;
} 

.f_snsbtn_area {
	float: none;
}
 
.f_main {
	width:70%;
} 
 
.f_main dl.f_main_l,
.f_main_r {
	float:none;
	width:70%;
}
.f_main dl dt {
	margin-bottom:10px;
}

.f_main dl dd ul {
	margin-bottom:20px;
}

 /* フッターSNSボタン */
.f_snsbtn_fb {
	width: 110px;
	margin-bottom:5px;
}

.f_snsbtn_ln {
	float:none;
	width: 110px;
}

/* お問い合わせ */
.f_contact_block {
	position: absolute;
	width: 250px;
	min-height: 300px;
	background: #EDEDED;
	right:5px;
	top:30px;
}
 }

 @media screen and (max-width:768px) {
.sp { display:none; }

.fl { float:none; }
.fr { float:none; }
 
#container {
	max-width: 100%;
	margin: 0 auto;
	background: #FFF;
}

#header h1#logo img {
	min-width:150px;
}

#header h1#logo img {
	max-width: 100%;
	height: auto;
}
 } 
 
@media screen and (max-width: 480px) {
.pc { display:none; }
.sp { display:block; }
.sp_only { display:block; }

.fl { float:none; }
.fr { float:none; }

/* フッター設定 */
.f_main {
	width:100%;
} 
 
.f_main dl.f_main_l,
.f_main_r {
	float:none;
	width:100%;
}

.f_snsbtn_area {
	width:100%;
}

.f_contact_block {
	background: #EDEDED;
	position:static;
	width:100%;
}

.f_snsbtn_ln {
	float:left;
	width: 110px;
}



#footer, .fixity #footer_nav {
/* width: 100%; */
	margin:0 10px;
	/* padding-top:10px; */
}

/* お問い合わせ設定 */
.f_contact {
	margin-bottom:10px;
}

.site_f_contact_img_tel {
	margin: 0 auto 8px;
}

.site_f_contact_btn_form {
	margin:0 auto;
}

/* フッターの赤い部分 */
#footer_nav ul li {
	position:static;
	display:block;
	padding:10px 0 10px 16px;
}

#footer_nav .site_fn_icon_arrow {
	position:static;
}

#footer_nav .copyright {
	text-align: center;
	margin: 0 auto;
}

/* 消費を見るボタン */
p.product_view {
	width:280px;
}
}
/* ================================================================
		オリジナル結婚はがき
================================================================ */
/*#contents{
  max-width: 1000px;
  margin: 0 auto;
}*/

.pink{
  color: #fe6263;
}

.bold{
  font-weight: bold;
}

.header{
  position: relative;
  padding-bottom: 10px;
  width: 100%;
  background:url("../images/_kekkon_original/bg_pink_top.png"),
              url(../images/_kekkon_original/bg_ttl_main.png),
              url("../images/_kekkon_original/bg_ribon.png"),
              url(../images/_kekkon_original/bg_wood.jpg);
  background-position: bottom,top,top,top;
  background-repeat:  no-repeat,no-repeat,repeat-x,repeat;
  background-size: 100%,1300px auto,auto,auto;
}

.header .wrap {
  position: relative;
}

.site_logo{
  position: absolute;
  top: 25px;
  left: 180px;
  z-index: 1000;
}

.top_01{
  /*width: 19%;
  height: auto;*/
  position: absolute;
  top: 15px;
  left: 0;
  z-index: 1;
}

.top_02{
  /*width: 75%;
  height: auto;*/
  /*position: absolute;
  top: 15px;
  left: 13%;*/
  padding-bottom: 20px;
  text-align: center;
  position: relative;
  z-index: 2;
}

.wrap{
  width: 1000px;
  margin: 0 auto;
}

/*.category_list{
  text-align: center;
  padding-bottom: 50px;
  width: 100%;
  height: auto;
  background: url("../images/_kekkon_original/bg_pink.jpg");
  background-repeat: repeat;
}*/

.contents_01{
  width: 100%;
  background: url("../images/_kekkon_original/bg_pink.jpg");
  background-repeat: repeat;
  padding-bottom: 50px;
}

.category_list_01{
/*  width: 100%;
  max-width: 1000px;
  margin: 0 auto;*/
  text-align: center; 
}

.category_list_01 .ttl_01{
  padding-top: 50px;
}

/*.category_list_02{
  width: 100%;
  max-width: 1000px;
}*/

.ttl{
  text-align: center;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
}

.ttl_01{
  text-align: center;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  width: 800px;
  margin: 0 auto;
}

.ttl_02{
  text-align: center;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  width: 1000px;
  margin: 0 auto;
  margin-bottom: 40px;
}

.category_list_box{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  padding-top: 50px;
}

.category_box_01{
  display: inline-block;
  align-items: center;
  justify-content:center;
  margin: 0 auto;
  padding: 50px;
}


.category_box_01 img{
  width: 200px;
  height: auto;
  box-shadow: 4px 4px 4px rgba(0,0,0,.2); 
  transition-duration: 0.2s;
}

.category_box_01 img:hover{
  transform: scale(1.1,1.1);
}

.category_box_02{
  padding: 10px;
}

.category_box_02 img{
  width: 200px;
  height: auto;
  box-shadow: 4px 4px 4px rgba(0,0,0,.2);
  transition-duration: 0.2s;
}

.category_box_02 img:hover{
  transform: scale(1.1,1.1);
}

.category_box_03{
  padding: 10px;
}

.category_box_03 img{
  width: 305px;
  height: auto;
  box-shadow: 4px 4px 4px rgba(0,0,0,.2);
  transition-duration: 0.2s;
}

.category_box_03 img:hover{
  transform: scale(1.1,1.1);
}

.contents_02{
  height: 450px;
  background: url("../images/_kekkon_original/bg_pink_btm.png"),
              url("../images/_kekkon_original/bg_type01.jpg");
  background-repeat: no-repeat,repeat;
  background-position: top,center;
  background-size: 100%,auto;
  box-shadow: 0 4px 4px rgba(0,0,0,.3);
}

.contents_02 .ttl_02{
  padding-top: 120px;
}

.order_flow{
  width: 1000px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}

.order_flow img{
  padding: 8px;
}

.order_flow_sub_01{
  position: absolute;
  left: 403px;
  top: 75px;
}

.order_flow_sub_02{
  position: absolute;
  left: 345px;
  top: 115px;
}

.contents_03{
  background: #fff;
  background: url("../images/_kekkon_original/bg_flower01.png"),url("../images/_kekkon_original/bg_flower02.png");
  background-position: top left,bottom right;
  background-repeat: no-repeat,no-repeat;
  width: 100%;
  max-width: 1000px;
  height: auto;
  margin: 0 auto;
  padding: 60px 0;
}

.order_02_box{
  display: flex;
  padding: 20px;
}

.order_02_img{
  width: 45%;
  flex-grow: 1;
}

.order_02_img img{
  width: 100%;
  
}

.order_02_des{
  width: 45%;
  padding-left: 50px;
  flex-grow: 1;
}

.order_02_des img{
  width: 100%;
}

.contents_04{
  width: 100%;
  background: url("../images/_kekkon_original/bg_type02.jpg");
  background-repeat: repeat;
  padding: 60px 0;
}

.contents_04_sub{
  width: 900px;
  margin: 0 auto;
}

.contents_04 li{
  list-style-type: disc;
  margin-left: 30px;
}

.contents_04_btn_01{
  text-align: center;
}

.contents_04_btn_01 a{
  background: #ff725e;
  padding: 30px 30px 15px 30px;
  border-radius: 10px;
  box-shadow: 2px 2px 4px rgba(0,0,0,.3);
}

.contents_04_btn_01 a:hover{
  background: #fe9d73;
}

.contents_04_btn_02 img{
  display: none;
}


@media screen and (max-width: 768px) {
  
  body {
	  min-width:100% !important;
  }
  
  .header{
    background-size: 100%,130% auto,auto,auto;
  }
  
  .top_01{
    position: absolute;
    width: 20%;
    top: 80px;
    left: 0;
    z-index: 1;
  }

  .top_02{
    width: 100%;
    top: -5px;
    left: -20px;
    padding-bottom: 10px;
    text-align: center;
    position: relative;
    z-index: 2;
  }
  
  .site_logo img{
    width: 100px;
    position: absolute;
    top: -20px;
    left: -110px;
    z-index: 1000;
  }
  
  .wrap{
    width: auto;
  }
  
  .ttl_01{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding-top: 10px;
    width: auto;
  }
  
  .ttl_01 img{
    padding: 10px 10px 0 10px;
    height: 30px;
    max-width: 100%;
  }
  
 .ttl_02{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding-top: 10px;
    width: auto;
  }
  
  .ttl_02 img{
    padding: 10px 10px 0 10px;
    height: 25px;
    max-width: 100%;
  }
  
  .category_box_01{
    padding: 20px 50px;
  }
  
  .category_box_01 img  {
    width: 100%;
    max-width: 400px;
    height: auto;
  }
  
  .category_box_01 img:hover{
    transition-duration: 0;
    transform: scale(1,1);
  }
  
 .category_list_box{
    justify-content: center;
   padding: 0;
  }
  
  .category_box_02{
    padding: 20px 50px;
  }
  
  .category_box_02 img  {
    width: 100%;
    max-width: 400px;
    height: auto;
  }
  
  .category_box_02 img:hover{
    transition-duration: 0;
    transform: scale(1,1);
  }
  
  .category_box_03{
    padding: 20px 50px;
  }
  
  .category_box_03 img  {
    width: 100%;
    max-width: 400px;
    height: auto;
  }
  
  .category_box_03 img:hover{
    transform: scale(1,1);
  }
  
  .contents_02{
    height: 1300px;
  }
  
  .ttl_02{
    margin-bottom: 30px;
  }
  
  .contents_02 .ttl_02{
  padding-top: 70px;
}
  
  .order_flow{
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
  }
  
  .of{
    margin-top: 90px;
  }
  
  .order_flow_sub_01{
    position: absolute;
    top: 425px;
    left: auto;
    margin: 0 auto;
  }
  
  .order_flow_sub_02{
    position: absolute;
    top: 470px;
    left: auto;
    margin: 0 auto;
  }
  
  .order_flow_sub_02 img{
    width: 90%;
  }
  
  .contents_03{
    padding: 30px 0;
  }
  
 .order_02_box{
  display: flex;
  flex-direction: column;
  padding: 20px;
}
  
  .order_02_img{
    max-width: 100%;
    width: 100%;
    padding-bottom:50px; 
}


  .order_02_des{
    width: 100%;
    padding: 10px 0;
  }
  
  .order_02_des img{
    max-width: 100%;
  }
  
  .contents_04{
    padding: 30px 0;
  }
  
  .contents_04_sub{
    padding-top: 10px;
    width: 85%;
  }

  .contents_04_btn_01{
    display: none;
  }
  
  .contents_04_btn_02{
    text-align: center;
  }
  
  .contents_04_btn_02 img{
    display: inline;
    width: 60%;
    max-width: 100%;
  }
  
  .contents_04_btn_02 img{
    background: #ff725e;
    padding: 25px;
    border-radius: 10px;
    box-shadow: 2px 2px 4px rgba(0,0,0,.3);
  }

  .contents_04_btn_02 img:hover{
    background: #fe9d73;
  }

}

@media screen and (max-width: 480px) {
  
  .site_logo img{
    width: 70px;
    top: -20px;
    left: -130px;
  }
  
  .ttl_01 img{height: 20px;}
  .ttl_02 img{height: 20px;}
  
}

/* ================================================================
		cleafix
================================================================ */
.clearfix{ /zoom : 1; }
.clearfix:after { content : ''; display : block; clear : both; }