@charset "utf-8";

/* 共通設定
========================================================================== */
/* リンク矢印 */
.link_arrow_or {
    font-size:14px;
    background: url("../common/images/img_arrow_or_b.png") no-repeat 0 5px;
    margin: 10px 0;
    padding: 0 0 0 20px;
}

/* 見出し初期化 */
#main h2 {
	font-weight:bold;
	line-height: 1;
	height: auto;
	margin: 0;
	padding: 0;
	background:none;
}

/* 2カラム解除 */
#cnt_r {
	width:100%;
	float:none;
}

/* slick Arrows */
.slick-prev,
.slick-next {
	width: 32px;
	height: 32px;
	z-index: 100;
}
.slick-prev:before,
.slick-next:before {
	font-size: 32px;
	color: #878987;
}

/* 共通レイアウト
========================================================================== */
#contents {
	width: 100%;
	margin-bottom: 0;
}
.inner {
	width: 1200px;
	margin: 0 auto;
}

/* 見出し
---------------------------------------------------------- */
#main h2.section-title {
	font-size: 24px;
	color: #333;
	text-align: center;
}
#main h3.sub_title{
	font-size: 18px;
	font-weight: bold;
	text-align: left;
	letter-spacing: 0.06em;
	padding-left: 24px;
	margin-bottom: 12px;
}

/* バナー画像設定
---------------------------------------------------------- */
.lpbnr_images{
	border-radius: 10px;
	box-shadow: 0px 0px 16px rgb(0,0,0,.16);
	transition: .3s all;
	width: 100%;
    height: auto;
}
.lpbnr_images:hover{
	opacity: .7;
}

/* アイス棒ボタン
---------------------------------------------------------- */
.btn_g {
	width: 360px;
	margin: 0 auto;
}
.btn_g a{
	position: relative;
	display: flex;
	justify-content: center;
	font-size: 20px;
	font-weight: bold;
	color: #fff;
	line-height: 1;
	letter-spacing: 0.05em;
	text-decoration: none;
	border-radius: 28px;
	background-color: #23af3c;
	padding: 20px 0 16px;
	margin: 0 auto;
	box-sizing: border-box;
	transition: opacity .3s;
}
.btn_g a:hover::after{
	/* opacity: .7; */
	/* color: #fff; */
}
.btn_g-arrow {
	position: relative;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #fff;
	top: -2px;
	right: -6px;
	transition: all .3s;
}
.btn_g-arrow::after {
	position: absolute;
	content: "";
	top: 50%;
	left: 38%;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-style: solid;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 8px solid #23af3c;
	border-right: 0;
}
.btn_g a:hover .btn_g-arrow{
	right: -15px;
}
/* ランキングボタン
---------------------------------------------------------- */
.btn_ranking {
	background: #fff;
	border-radius: 18px;
}
.btn_ranking a {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 36px;
	font-size: 16px;
	font-weight: bold;
	letter-spacing: 0.05em;
	padding-top: 2px;
	border-radius: 18px;
	background-color: #fff;
	text-decoration: none;
	transition: opacity .3s;
	box-sizing: border-box;
}
.btn_ranking a::before {
	content: url("../common/images/ico_crown-g.svg");
	margin: 0 6px 2px 0;
}
.btn_ranking a:hover {
	opacity: .7;
	color: #333;
	background-color: #fff;
}
.btn_ranking.btn_ranking-heading {
	width: 260px;
	position: absolute;
	top: 12px;
	right: 190px;
}
.btn_ranking.btn_ranking-corporate,
.btn_ranking.btn_ranking-shop {
	width: 340px;
	margin: 24px auto 0;
}

/* 絞り込みバナー
---------------------------------------------------------- */

/* デザインタイプ */
.search_bnr-link.-design {
	background: #FFA52A;
}
.search_bnr-link.-design::after {
	background: url("/common/images/search/ico_search-design.png") 0 0 no-repeat;
	background-size: contain;
}
/* 写真フレームタイプ */
.search_bnr-link.-photo {
	background: #23C864;
}
.search_bnr-link.-photo::after {
	background: url("/common/images/search/ico_search-photo.png") 0 0 no-repeat;
	background-size: contain;
}

/* slick設定
---------------------------------------------- */
/* ロード時の表示崩れ防止 */
.slider_list {
  display: none;
}
.slider_list.slick-initialized {
  display: block;
}
/* slick共通 */
.slick-slide img {
  width: auto;
}
.slick-slider {
  width: auto;
  margin: 0;
  left: 50%;
  transform: translateX(-50%);
}
.slide_cover{
  width: 1016px;
  margin: 0 auto;
}
.slider-item {
  padding: 16px 12px;
}
.slider-image{
  box-shadow: 0px 0px 10px rgb(0 0 0 / 25%);
  border-radius: 16px;
}

/* 納期表示
========================================================================== */
#box_delivery {
	margin: 20px auto 0;
}
#box_delivery .caution {
	text-indent: -0.4em !important;
	padding-left: 0 !important;
}
.delivery_inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 1000px;
	margin: 0 auto;
}
.delivery_today {
	display: flex;
	align-items: center;
	font-weight: bold;
	width: 744px;
	height: 44px;
	border: 2px solid #62BF5F;
	box-sizing: border-box;
}
.delivery_today-text {
	font-size: 16px;
	color: #fff;
	letter-spacing: 0.075em;
	width: 160px;
	height: inherit;
	line-height: 44px;
	background: #62BF5F;
}
.delivery_today-inner {
	display: flex;
	justify-content: center;
	width: calc(100% - 160px);
}
.delivery_today-desc {
	display: flex;
	align-items: center;
	font-size: 18px;
	letter-spacing: 0.06em;
	line-height: 1.5;
}
.delivery_today-desc:not(:last-child) {
	margin-right: 16px;
}
.delivery_today .category {
	display: inline-block;
	width: 72px;
	height: 22px;
	font-size: 11px;
	color: #fff;
	text-align: center;
	line-height: 24px;
	letter-spacing: 0.025em;
	background: #D70C18;
	border-radius: 3px;
	margin-right: 8px;
}
.delivery_today .num {
	font-size: 24px;
	vertical-align: baseline;
}
.delivery_caution {
	font-size: 11px;
	letter-spacing: 0.025em;
	line-height: 1.5;
	width: 258px;
	margin-left: 10px;
}

/* info各種
========================================================================== */
/* お知らせ
---------------------------------------------- */
.info_container {
	margin:0px auto 12px;
}

.info_area {
	background: #aab1b5;
  align-items: center;
  display: flex;
  width: 100%;
}
.info_area dt {
	background: #aab1b5;
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	width: 13%;
}
.info_area dd {
	background: #f9f9f8;
	font-size: 14px;
	text-align: left;
	padding: 7px 20px;
	width: 87%;
}
.info_area dd ul li + li {
	margin-top: 5px;
}
.info_area dd ul li span {
	display: inline-block;
	width: 96px;
	padding-right: 1.4rem;
}
.info_area dd ul li a {
	color: #3e3a39;
	font-weight: bold;
}
.info_area dd ul li a:hover {
	color: #ff9900;
}
.info_area dd ul li a.info_link-red {
	color: #fa2d2d;
}
.info_area dd ul li a.info_link-red:hover {
	color: #fa2d2d;
	text-decoration: none;
}

/* サイトクローズ関連
---------------------------------------------- */
.box_soon {
  width: 1200px;
	margin: 0 auto 24px;
	padding: 28px 24px;
	text-align: center;
	background-color: #f9f9f8;
}
.box_soon dt {
	margin-bottom: 20px;
	font-weight: bold;
	color: #d70c18;
	font-size:22px;
}
.box_soon dd {
  font-size:16px;
}
.kanchu_bnr{
  margin: 12px auto;
}
.info_kanchu{
	font-weight: bold;
	font-size: 20px;
	color: #B69569;
	margin-bottom: 8px;
}
.box_soon a:hover img {
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
#browser_security {
	border: 2px solid #FF0000;
	background: #FFEEEE;
	margin-bottom: 30px;
		padding: 20px 30px;
	color: #FF0000;
	display: none;
}
/* KV
========================================================================== */
picture {
    margin: 0;
    padding: 0;
    display: inline-block;
    line-height: 0;
}
.mv{
	height: 400px;
	width: 100%;
	margin-bottom: 11px;
	overflow: hidden;
}
.mv_inner{
	position: relative;
	height: 100%;
}
.mv_inner::before,
.mv_inner::after{
	content: "";
	display: block;
	width:50%;
	height: 100%;
	position: absolute;
	top: 0;
	z-index: -1;
}
.mv_inner::before{
	background-color:#fff;
	background:url("../images/mv/bg_r.png") repeat-x;
	left: 0;
}
.mv_inner::after{
	background-color:#fff;
	background:url("../images/mv/bg_l.png") repeat-x;
	right: 0;
}
.mv_box{
	position: relative;
	width: 1220px;
	margin: auto;
}
.mv_box::after {
    content: "";
    display: block;
    background: url(../images/mv/repeat_icon.png) no-repeat 0 0 / contain;
    width: 263px;
    height: 156px;
    position: absolute;
    bottom: -5px;
    right: 0;
	pointer-events: none;
}

.mv_box .hagaki_img {
    width: 200px;
    position: absolute;
    top: 53px;
}
.mv_box .hagaki_img a{
	display: block;
}
.mv_box .hagaki_img img,.mv_btn img{
	width: 100%;
	height: auto;
}
.mv_box .hagaki01{
	right:43%;
}
.mv_box .hagaki02{
	right:24%;
}
.mv_box .hagaki03{
	right:4.6%;
}
.mv_box .mv_btn {
    position: absolute;
    bottom: 52px;
    left: 25px;
    width: 340px;
    height: auto;
}
.mv_box a:hover{
	opacity: .8;
}
/* キャンペーン周り
========================================================================== */
#box_cam{
	margin-bottom: 30px;
}
#box_cam .cam_list{
	margin-top: 10px;
	display: flex;
	justify-content: center;
	gap:0 32px;
}
#box_cam .cam_list .cam_item{
	border-radius: 10px;
	overflow: hidden
}
#box_cam .cam_list .cam_item a {
    display: block;
}
#box_cam .cam_list .cam_item a:hover{
	opacity: .8;
}
#box_cam .cam_list .cam_item a img{
	width: 100%;
	height: auto;
}
/* 訴求バナー
========================================================================== */
.appeal {
  margin-bottom: 72px;
}
.appeal_list {
	display: flex;
	justify-content: center;
	column-gap: 24px;
}
.appeal_item {
    position: relative;
    width: 232px;
    border-radius: 8px;
    overflow: hidden;
}
.appeal_item a {
    display: block;
		border-radius: 8px;
}

.appeal_item:first-child {
	margin-left: 0;
}

/* カテゴリからデザインを選ぶ
========================================================================== */
/* 共通 */
/*.entrance{
	margin-bottom: 80px;
}*/
.entrance_head{
	/*margin-bottom: 64px;*/
	margin-bottom: 44px;
}
.entrance_head-list{
	display: flex;
	margin-top: 40px;
}
.entrance_head-item{
	width: 238px;
	border-left: 2px solid #EDEDED;
    box-sizing: border-box;
}
.entrance_head-item:last-child{
	border-right: 2px solid #EDEDED;
}
.entrance_head-link {
    display: block;
    width: 100%;
    text-decoration: none;
    font-size: 19px;
    font-weight: bold;
    text-align: center;
    transition: all .3s;
    height: 48px;
    line-height: 52px;
}
.entrance_head-arrow{
	display: inline-block;
	position: relative;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	top: 2px;
	right: -4px;
	transition: all .3s;
	background: #333;
}
.entrance_head-arrow::after{
	position: absolute;
	content: "";
	top: 52%;
	left: 26%;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-style: solid;
	border-top: 7px solid #fff;
	border-right: 5px solid transparent;
	border-left: 5px solid transparent;
	border-bottom: 0;
}
.entrance_head-item:hover .entrance_head-arrow{
	background: #fff;
}
.entrance_head-item:hover .entrance_head-arrow::after{
	transition-delay: .06s;
}
/* デザインタイプ */
.entrance_head-item.-design:hover .entrance_head-link{
	color: #fff;
	background: #FFA52A;
}
.entrance_head-item.-design:hover .entrance_head-arrow::after{
	border-top: 7px solid #FFA52A;
}
/* 写真フレームタイプ */
.entrance_head-item.-photo:hover .entrance_head-link{
	color: #fff;
	background: #23C864;
}
.entrance_head-item.-photo:hover .entrance_head-arrow::after{
	border-top: 7px solid #23C864;
}
/* 企業さま向け */
.entrance_head-item.-corporate:hover .entrance_head-link{
	color: #fff;
	background: #1C2F61;
}
.entrance_head-item.-corporate:hover .entrance_head-arrow::after{
	border-top: 7px solid #1C2F61;
}
/* デザイン企画 */
.entrance_head-item.-design_plan:hover .entrance_head-link{
	color: #fff;
	background: #D70C18;
}
.entrance_head-item.-design_plan:hover .entrance_head-arrow::after{
	border-top: 7px solid #D70C18;
}
/* 条件から探す */
.entrance_head-item.-terms:hover .entrance_head-link{
	color: #fff;
	background: #F85C9D;
}
.entrance_head-item.-terms:hover .entrance_head-arrow::after{
	border-top: 7px solid #F85C9D;
}

.entrance_head .other_link{
	justify-content: flex-end;
	margin-top: 20px;
}
/* カテゴリエリア
========================================================================== */
/* 共通設定
------------------------------------------------ */
/* タイトル */
.choice_container{
	margin-bottom: 72px;
	box-sizing: border-box;
	padding: 0;
	background: #fff;
	text-align: left;
}
.choice_head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 36px;
	padding: 16px 24px 14px;
	color: #fff;
}
.choice_head-number {
    margin-left: auto;
}
.type_number {
	font-size: 34px;
	position: relative;
	top: 0.05em;
	letter-spacing: 0.04em;
}
/* カテゴリボタン */
.choice_list {
	display: flex;
	flex-wrap: wrap;
	gap:16px 32px;
}
.choice_item {
	position: relative;
	width: calc((100% - 32px * 3) / 4);
}
.choice_item::before {
	position: absolute;
	content: "";
	display: block;
	width: 100%;
	height: 80px;
	left: 0;
	bottom: 0;
/*	outline: 4px solid transparent;*/
	border-radius: 15px;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 16%);
	transition: .2s all linear;
	background: #eee;
}
.choice_item-inner{
	padding-top: 30px;
	overflow: hidden;
}
.choice_item-link {
	display: block;
	position: relative;
	padding: 20px 0 0;
	border-radius: 10px;
	text-decoration: none;
	background: #fff;
	height: 80px;
	transition: .3s;
}
.choice_item-link:hover {
	color: #333;
}
.title_cate {
	display: block;
	font-size: 20px;
	font-weight: bold;
	text-align: left;
	margin-left: 16px;
}
/* はがき設定 */
.choice_item-link::before {
	content: "";
	display: block;
	position: absolute;
	bottom: -17px;
	right: 22px;
	width: 80px;
	height: 118px;
	box-shadow: 5px 5px 10px rgba(0 0 0 / 16%);
	transform: scale(1);
	-webkit-transform: scale(1);
	transition: .2s all linear;
}
.choice_item-link:hover::before {
	transform: scale(1.07);
	-webkit-transform: scale(1.07);
	opacity: 1;
}
/*人気ランキング*/
.choice_head-ranking{
	font-size: 16px;
	color: #333;
	border-radius: 15px;
	background: #fff;
	text-align: center;
	width: 254px;
	height: 30px;
	line-height: 35px;
	margin-left: 29px;
	overflow: hidden;
}
.choice_head-ranking a::before{
	content: "";
	display: inline-block;
	width: 20px;
	height: 16px;
	margin-right: 4px;
	background: url("../group_common/images/icon/ranking_icon.svg") no-repeat 0 0/contain;
	position: relative;
    top: 1px;
}
.choice_head-ranking a{
	text-decoration: none;
	display: inline-block;
	width: 100%;
	transition: .3s ease;
}
.choice_head-ranking a:hover{
	color: #fff;
	background: #bdb76b;
}
.choice_head-ranking a:hover::before{
	background: url("../common/images/item/ranking_icon_w.svg") no-repeat 0 0/contain;
	transition-delay: .1s;
}
/* カテゴリ別設定
------------------------------------------------ */
/* デザインタイプ */
.choice.-design .choice_head {
	background-color: #ffa52a;
}
.choice.-design .choice_item:hover .choice_item-link{
	background-color: #ffa52a;
	color: #fff;
}

/* デザインタイプ 法人さま向けのデザインはこちら */

/* 写真フレームタイプ */
.choice.-photo .choice_head {
	background-color: #23c864;
}
.choice.-photo .choice_item:hover .choice_item-link{
	background-color: #23c864;
	color: #fff;
}

/* 法人さま向けデザイン */
.corporate_container .choice_item:hover .choice_item-link{
	background-color:#1C2F61;
	color: #fff;
}
/* 条件から探す */
.choice.-pickup .choice_head {
	background-color:#F85C9D;
}
/* はがき設定
------------------------------------------------ */
/* デザインタイプはがき */
.choice_item.-natural .choice_item-link::before {
	background: url("../common/images/card/img_card_natural.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-jp_modern .choice_item-link::before {
	background: url("../common/images/card/img_card_modern.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-japanese .choice_item-link::before {
	background: url("../common/images/card/img_card_japanese.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-brush .choice_item-link::before {
	background: url("../common/images/card/img_card_brush.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-craft .choice_item-link::before {
	background: url("../common/images/card/img_card_craft.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-cute .choice_item-link::before {
	background: url("../common/images/card/img_card_cute.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-compe .choice_item-link::before {
	background: url("../common/images/card/img_card_compe.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-monochrome .choice_item-link::before {
	background: url("../common/images/card/img_card_monochrome.png") no-repeat top center;
	background-size: 100%;
}
/*.choice_item.-ranking .choice_item-link::before {
	background: url("/common/images/card/img_card_ranking.png") no-repeat top center;
	background-size: 100%;
}*/

/* 写真タイプはがき */
.choice_item.-frame1 .choice_item-link::before {
	background: url("../common/images/card/img_card_frame1.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-frame2 .choice_item-link::before {
	background: url("../common/images/card/img_card_frame2.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-frame3 .choice_item-link::before {
	background: url("../common/images/card/img_card_frame3.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-frame4 .choice_item-link::before {
	background: url("../common/images/card/img_card_frame4.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-p_full .choice_item-link::before {
	background: url("../common/images/card/img_card_full.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-tiny .choice_item-link::before {
	background: url("../common/images/card/img_card_tiny.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-wedding .choice_item-link::before {
	background: url("../common/images/card/img_card_wedding.png") no-repeat top center;
	background-size: 100%;
}
.choice_item.-birth .choice_item-link::before {
	background: url("../common/images/card/img_card_birth.png") no-repeat top center;
	background-size: 100%;
}

/* 法人さま向け */
.choice_item.-company .choice_item-link::before {
	background: url("../common/images/card/img_card_company.png") no-repeat center center;
	background-size: 100%;
}
.choice_item.-shop .choice_item-link::before {
	background: url("../common/images/card/img_card_shop.png") no-repeat center center;
	background-size: 100%;
}
.choice_item.-date .choice_item-link::before {
	background: url("../common/images/card/img_card_data.png") no-repeat center center;
	background-size: 100%;
}
.choice_item.-rnking .choice_item-link::before {
	background: url("../common/images/card/img_card_ranking.png") no-repeat center center;
	background-size: 100%;
}
/* おすすめ　LPバナーエリア */
.choice.-recommend .choice_head {
    background-color: #D70C18;
}
#box_recommend{
	margin-bottom: 72px;
}
.recommend_list{
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap:32px 30px; 
}
.recommend_item a{
	border-radius: 10px;
	overflow: hidden;
	display: block;
	transition: .3s;
}
.recommend_item a img{
	width: 100%;
	height: auto;
}
.recommend_item:hover a{
	opacity: .7;
}
/* 人気ランキング
========================================================================== */
.ranking{
  margin-bottom: 60px;
}
.ranking_container{
  padding: 38px 0 40px;
  background-color: #FAFAFA;
}
.ranking_box{
  display: flex;
  position: relative;
  justify-content: flex-start;
	align-items: center;
	gap: 0 47px;
}
.ranking_title{
  display: inline-block;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.6em;
}
.ranking_item{
  display: block;
  width: 200px;
}
.ranking_link{
  position: relative;
  display: flex;
  margin-bottom: 12px;
  background-color: #ffffff;
  padding: 6px 12px 4px;
  font-weight: bold;
  border-radius: 16px;
  text-decoration: none;
  transition: 0.3s all;
}
.ranking_link:hover {
  color: #fff;
  background: #D70C18
}
.ranking_link::after{
  content: '';
  width: 6px;
  height: 6px;
  border-top: solid 3px #000000;
  border-right: solid 3px #000000;
  position: absolute;
  left: 88%;
  top: 13px;
  transform: rotate(45deg);
}
.ranking_link:hover:after {
  border-top: solid 3px #FFF;
  border-right: solid 3px #FFF;
}
/* 人気ランキング スライダー
---------------------------------------------- */
.ranking_slider {
    width: 925px;
    height: auto;
    overflow: hidden;
    position: relative;
    padding-right: 15px;
}
.slide_area {
  position: relative;
}
.ranking_slider-item{
    width: 128px;
	counter-increment: count 1;
	text-align: center;
}
.ranking_slider-item::before{
    font-weight: bold;
    content: counter(count) "位";
    font-size: 18px;
    display: inline-block;
    margin-bottom: 8px;
    line-height: 1.5;
}
.ranking_slider-inner{
	position: relative;
	display: flex;
	align-items: stretch;
	flex-direction: column;
}
.ranking_slider-inner p {
  font-weight: bold;
  position: relative;
  top: -4px;
}
.ranking_slider-inner .slide_link-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.ranking_slider-inner a img {
  max-width: 100%;
  border: none;
  height: auto;
  vertical-align: bottom;
/*  box-shadow: 5px 5px 10px rgb(0,0,0,.16);*/
  transition: .3s;
}
.ranking_slider-inner a:hover img {
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.16);
}

/* 横はがき設定 */
ranking_slider-inner.width{
	display: flex;
	padding: 0 9px 0px 9px;
	width: 110px;
	align-items: center;
	left: 0;
	right: 0;
	margin: auto;
}
.swiper-slide-inner.width .slide_link-wrap {
	position: absolute;
	transform: translateY(50%);
}
/*スクロールバー*/
.ranking_slider .swiper-scrollbar {
    position: static;
    margin-top: 24px;
	width: 100%;
}
.ranking_slider .swiper-scrollbar-drag{
	background: #D70C18;
	cursor: pointer;
}
/* 法人さま向けデザイン・サービス
========================================================================== */
/* 法人さま向けデザイン・サービス */
.corporate{
	margin-bottom: 72px;
	background: #FAFAFA;
}
.corporate_top {
	margin: 0 auto 64px;	
	background: #1C2F61;
	background-size: auto;
}
.corporate_top-inner {
	position: relative;
	max-width: 1200px;
	margin: 0 auto;
	padding: 68px 0 64px;
	color: #fff;
}
.corporate_top-box{
	width: 557px;
}
.corporate_top-title {
	margin-bottom: 20px;
	font-size: 24px;
	font-weight: bold;
	letter-spacing: 0.05em;
}
.corporate_top-desc {
	margin-bottom: 32px;
	color: #fff;
	line-height: 1.75em;
	letter-spacing: 0.04em;
}
.corporate_top .btn_g{
	display: inline-block;
	width: 456px;
}
.corporate_top-hagaki{
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	gap:0 30px;
}
.corporate_top-hagaki img{
	display: inline-block;
	line-height: 0;
	box-shadow:0px 8px 8px 0px rgb(0 0 0 / 24%);
}
/* 法人さま向けデザイン */
.corporate_container {
	padding-bottom: 64px;
}
.choice_corporate{
	margin-bottom: 64px;
}
.choice_corporate .choice_head {
	background-color: #1C2F61;
}
.choice_corporate .order_cate::before {
	background: #1C2F61;
}

/* オプションサービス
========================================================================== */
.option_head{
	position: relative;
}
.option_freeicon{
    position: absolute;
    top: 9px;
    right: -25px;
    transform: translateY(-50%);
    display: inline-block;
    width: 70px;
    height: 70px;
    background-color: #D70C18;
    border-radius: 50%;
    z-index: 12;
}
.option_freeicon.ico_logo {
  left: 25%;
}
.option_freeicon-text{
    display: block;
    position: relative;
    font-size: 16px;
    text-align: center;
    top: 20%;
    color: #fff;
    font-weight: bold;
    line-height: 1.4em;
}
.option_freeicon-text span {
    display: inline-block;
    font-size: 27px;
    font-family: 'korolev', sans-serif;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1;
}
.option_item.-atena .option_freeicon-text {
    font-size: 15px;
    top: 28%;
}
.option_list {
	display: flex;
    flex-wrap: wrap;
	gap:0 30px;
	padding-top: 30px;
}
.option_item {
	width:216px;
	height: 216px;
	position: relative;
}
/*.option_item-head{
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 8px;
	text-align: center;
}*/
.option_item-link {
    display: flex;
    flex-direction: column;
    position: relative;
    padding: 24px 20px 0;
    text-decoration: none;
    overflow: hidden;
    background: #fff;
    border-radius: 10px;
    height: 100%;
	box-shadow: 0px 0px 16px 0px rgb(0 0 0 / 16%);
}
.option_item-link::before {
	position: absolute;
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	left: 0;
	bottom: 0;
	outline: 4px solid transparent;
	border-radius: 10px;
	transition: .2s all linear;
	z-index: 10;
}
.option_item-link:hover::before {
	outline: 3px solid #64B8B4;
	outline-offset: -3px;
}
.option_item-link:hover {
	color: #333;
}
.option_item-link::after {
	content: "";
	display: block;
	position: absolute;
	bottom:-17px;
	right: 68px;
	width: 80px;
	height: 118px;
	box-shadow: 0px 0px 8px 0px rgb(0 0 0 / 16%);
	transform: scale(1);
	-webkit-transform: scale(1);
	transition: .3s all;
	}
.option_item-link:hover::after {
	transform: scale(1.05);
	-webkit-transform: scale(1.05);
	opacity: 1;
}
.option_item-title {
	font-size: 20px;
	text-align: center;
	font-weight: bold;
	margin-bottom: 8px;
}
.option_item-text {
	position: relative;
	font-size: 14px;
	line-height: 1.7em;
}
/* 宛名印刷 */
.option_item.-atena .option_item-link::after {
	background: url("../group_common/images/hagaki/hagaki_address.webp") no-repeat top center;
	background-size: 100%;
}
/* 個別レイアウト対応 */
.option_item.-original .option_item-link::after {
	background: url("/common/images/card/img_card_original_appeal.png") no-repeat top center;
	background-size: 100%;
}
/* ロゴ入れ対応 */
.option_item.-logo .option_item-link::after {
	background: url("/common/images/card/img_card_logo_appeal.png") no-repeat top center;
	background-size: 100%;
}
/* QRコード印刷対応 */
.option_item.-qrcode .option_item-link::after {
	background: url("/common/images/card/img_card_qr_appeal.png") no-repeat top center;
	background-size: 100%;
}
/* サンプル文例 */
.option_item.-sample .option_item-link::after {
	background: url("/common/images/card/img_card_c_smp_appeal.png") no-repeat top center;
	background-size: 100%;
}


/* お好きな条件から選ぶ
========================================================================== */
#main .pickup_condition h3.sub_title {
    margin-bottom: 30px;
}
.pickup {
	margin-bottom: 96px;
}
.pickup_list{
	margin-bottom: 72px;
}
.pickup_list {
	display: flex;
	justify-content: space-between;
	gap:0 32px;
}
.pickup_item{
	width:calc((100% - 32px * 3) / 4);
	height: 80px;
	overflow: hidden;
	border-radius: 10px;
	box-shadow: 5px 5px 10px rgba(0 0 0 / 16%);
	position: relative;
}
.pickup_item-link{
	display: block;
	padding: 20px 0 0 16px;
	width:100%;
	height: 100%;
	text-decoration: none;
	transition: .3s;
}
.pickup_item-link:hover {
	color: #333;
	opacity: .8;
}
.pickup_inner{
	font-weight: bold;
}
.pickup_inner-title{
	font-size: 16px;
	line-height: 1;
	margin-bottom: 7px;
}
.pickup_inner-text{
	font-size: 18px;
}
.pickup_item:not(:nth-child(n+3)) .pickup_inner{
	color: #fff;
}
/*条件から絞り込む*/
.pickup_item.-search_design{
	background: url("../common/images/search/bnr_search-design.png") no-repeat 0 0 /contain;
}
.pickup_item.-search_photo{
	background: url("../common/images/search/bnr_search-photo.png") no-repeat 0 0 /contain;
}
.pickup_item.-designer {
    background: url("../images/box_pick/bnr_designer.png") no-repeat;
}
.pickup_item.-data .pickup_item-link::after{
	content: "";
	display: inline-block;
    background: url("../common/images/card/img_card_data.png") no-repeat 0 0/ contain;
	width: 60px;
	height: 88px;
	box-shadow: 0px 0px 8px 0px rgba(0,0,0,16%);
	position: absolute;
	top: 10px;
	right: 24px;
}

/* 条件別カテゴリ */
.pickup_condition{
	margin-bottom: 96px;
}
.pickup_condition-list{
	display: flex;
	justify-content: space-between;
	gap: 0 17px;
}
.pickup_condition-link{
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: 15px;
    letter-spacing: 0.05em;
    height: 40px;
    border-radius: 4px;
    background-color: #fff;
    transition: .2s all;
    padding: 0 1.1em;
	box-shadow: 0px 0px 8px 0px #00000029;
}

/* お客様の声
========================================================================== */
#box_voice{
	margin-bottom: 72px;
}
#box_voice .swiper-slide img{
	border-radius: 20px;
}
.voice_desc{
	font-size: 16px;
	margin-top: 24px;
	text-align: center;
}
/* 挨拶状ドットコム年賀状のサービス
========================================================================== */
/* 共通設定 */
.service{
	margin-bottom: 96px;
	padding: 80px 0;
	background: #F5F5F5;
}
#box_service h2{
	margin-bottom: 40px;
}
.address_container{
}
.main_service {
    background: #fff;
    padding: 72px 64px;
}
.other_service{
    padding:72px 64px;	
}
.address_subtitle{
  font-size: 26px;
  font-weight: bold;
  text-align: center;
  border-top:2px solid #D70C18;
  border-bottom:2px solid #D70C18;
  margin-bottom: 40px;
  padding: 12px 0;
}
.address_feature{
  margin-bottom: 64px;
}
.feature_list{
  display: flex;
  justify-content: space-between;
  column-gap: 48px;
  margin-bottom: 48px;
}
.feature_item{
  width: calc((100% - 48px) / 3);
}
.feature_inner-title,
.flow_head-title,
.file_head {
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 16px;
	line-height: 1.6em;
}
.feature_inner-text,
.flow_head-text{
  letter-spacing: 0.04em;
}
.caution-red{
	color: #D70C18;
}
/* 宛名印刷
---------------------------------------------- */
#box_service .address_head{
	display: flex;
	justify-content: space-between;
	gap:0 64px;
	margin-bottom: 64px;
}
#box_service .address_head-inner{
	width: 474px;
}
#box_service .section-title.-address{
  display: flex;
  align-items: center;
}
#box_service .address_date {
  border: 2px solid #D70C18;
  border-radius: 6px;
  color: #D70C18;
  font-size: 18px;
	padding: 4px 10px 3px 10px;
  margin-left: 16px;
}
#box_service .address_head_text{
  color: #000;
  letter-spacing: 0.02em;
	margin: 24px 0 28px;
}
#box_service .address_head .btn_g{
	display: inline-block;
	margin: 0 auto 40px;
}

/* 宛名印刷 3つのポイント */
.feature_point{
	background: #D70C18;
	font-size: 20px;
	font-weight: bold;
	font-family: korolev, sans-serif;
	font-display: swap;
	color: #FFF;
	border-radius: 6px;
	display: block;
	width: 96px;
	height: 32px;
	line-height: 36px;
	margin: 0 auto 20px;
	text-align: center;
}
.feature_inner-link{
	font-weight: bold;
}
/* 宛名注文のながれ */
.address_flow{
  margin-bottom: 64px;
}
.flow_head{
  text-align: center;
}
.flow_head-text{
  margin-bottom: 32px;
}
.flow_list{
  display: flex;
  justify-content: space-between;
  column-gap: 64px;
}
.flow_item{
  text-align: center;
  position: relative;
}
.flow_item::after {
  position: absolute;
  content: '';
  top: 32%;
  left: -21%;
  width: 0;
  height: 0;
  border-left: 20px solid #D70C18;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}
.flow_item:first-child:after{
  content: none;
}
.flow_item-text{
  margin-top: 16px;
  font-size: 18px;
  font-weight: bold;
}
/* 宛名ファイル対応 */
.file_head{
  position: relative;
}
.file_head::before,
.file_head::after {
  content: "";
  display: block;
  width: 2px;
  height: 30px;
  background: #242424;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}
.file_head::before {
  left: 15%;
  transform:rotate(-20deg);
}
.file_head::after {
  right: 15%;
  transform:rotate(20deg);
}

.address_file{
	width: 920px;
	margin: 0 auto;
	position: relative;
}
.file_btn{
	position: relative;
	display: block;
	border-radius: 10px;
	color: #FFF;
	text-decoration: none;
	background: #68A271;
	transition: all 0.2s ease 0s;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 26px 0 22px;	
}
.file_btn:hover{
  color: #fff;
  opacity: 0.7;
}
.file_btn::before{
	content: '';
	display: inline-block;
	background: url("../../group_common/images/icon/service/ico_file.webp") no-repeat 0 0 / cover;
	width: 120px;
	height: 120px;
	order: 1;
	margin-right: 15px;
}
.file_btn::after{
	content: '';
	display: block;
	background: url("../group_common/images/icon/ico_excel_csv.webp") no-repeat 0 0 / contain;
  height: 144px;
  width: 65px;
	order: 2;
}
.file_inner{
	padding:0;
    width: 547px;
    order: 3;
    margin-left: 53px;
}
.file_inner-title{
	display: flex;
	align-items: center;
	font-size: 22px;
	font-weight: bold;
	margin-bottom: 16px;
}
.file_inner-title p {
    width: 212px;
}
.file_price {
    position: relative;
    margin-left: 27px;
    display: flex;
    align-items: center;
    gap: 0 10px;
}
.file_inner-price{
    position: static;
    font-size: 16px;
    letter-spacing: 0.05em;
    padding: 3px 12px 2px;
    margin-right: 10px;
	display: inline-block;
}
.file_inner-price::after{
	content: none;
}
.file_price .option_linethrough::after {
    content: "";
    position: absolute;
    top: 38%;
    left: -8px;
    width: 110px;
    border-top: 5px double #ffffff;
}
.file_price .file_inner-campaign {
    margin-left: 0;
}
.file_inner-arrow{
	position: relative;
	display: inline-block;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: #fff;
	top: 2px;
	right: -6px;
}
.file_inner-arrow::after{
	position: absolute;
	content: "";
	top: 50%;
	left: 38%;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-style: solid;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 8px solid #68A271;
	border-right: 0;
}
.file_inner-text{
  letter-spacing: 0.02em;
  margin-bottom: 12px;
}


/* その他のサービス */
.other{
	margin-bottom: 60px;
}
.other_list{
	display: flex;
	gap: 0 32px;
	margin-top: 40px;
}
.other_item{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px 0;
	width: calc(100% / 4);
}
.other_item-link{
	position: relative;
	text-decoration: none;
	font-size: 22px;
	font-weight: bold;
	transition: .3s all;
}
.other_item-link:hover{
	opacity: .7;
	color: #333;
}
.other_item-arrow{
	position: relative;
	display: inline-block;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: #23AF3C;
	top: 2px;
	right: -6px;
}
.other_item-arrow::after{
	position: absolute;
	content: "";
	top: 50%;
	left: 38%;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-style: solid;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 8px solid #fff;
	border-right: 0;
}
/* すでに商品をご購入のお客さま */
.purchased_container{
  display: flex;
	justify-content: center;
  padding: 24px 32px;
  background-color: #FAFAFA;
}
.purchased_title{
  font-size: 22px;
  margin: 0 40px 0 0;
  font-weight: bold;
}
.purchased_list{
  display: flex;
  column-gap: 40px;
}
.purchased_item{
  font-size: 14px;
  letter-spacing: 0.02em;
}

/* はがき印刷専門サイトで3部門No.1を獲得しました
========================================================================== */
.no1{
  margin-bottom: 96px;
}
.no1_box{
  text-align: center;
}
.no1_head{
  margin-bottom: 20px;
}
.no1_text{
  font-size: 14px;
  margin-bottom: 40px;
}
.no1_list{
  display: flex;
  justify-content: center;
  align-items: flex-end;
  column-gap: 28px;
}
.no1_item:first-child{
  margin-right: 12px;
}


/* 公募企画
========================================================================== */
.public {
	margin-bottom: 96px;
}
.public_list {
	display: flex;
	justify-content: space-between;
	margin-top: 42px;
}
.public_item {
	width: calc((100% - 40px) / 2);
}
.public_item a img {
	border-radius: 10px;
	box-shadow: 0px 0px 10px rgb(0,0,0,.16);
	transition: opacity .3s;
	width: 100%;
	height: auto;
}
.public_item a:hover img {
	opacity: .7;
}
.public_item-text {
	margin-top: 16px;
	text-align: center;
}

/* 年賀状のお役立ち情報
========================================================================== */
.useful {
	margin-bottom: 96px;
}
.useful_list {
	display: flex;
	justify-content: space-between;
	margin-top: 42px;
}
.useful_item {
	width: calc((100% - 40px) / 2);
}
.useful_item a img {
	border-radius: 10px;
	box-shadow: 0px 0px 10px rgb(0,0,0,.16);
	transition: opacity .3s;
	width: 100%;
	height: auto;
}
.useful_item a:hover img {
	opacity: .7;
}
.useful_item-text {
	margin-top: 16px;
	text-align: center;
}


/* スタッフコラム
========================================================================== */
#main .staff_column .section-title{
	margin-bottom: 36px;
  }
  .staff_column{
	margin-bottom: 88px;
	padding: 96px 0;
    background: #F5F5F5;
  }
  .staff_column .swiper_container{
    margin: 0 auto;
  }
  .staff_column .slide_cover{
	margin: 0 auto 48px;
  }
  .column_slider-item{
	padding: 0;
  }
  .column_card {
	width: auto;
	height: 320px;
	box-shadow: 0px 0px 15px rgb(0,0,0,.16);
	border-radius: 24px;
	overflow: hidden;
	background: #fff;
  }
  .column_card-link {
	display: block;
	text-decoration: none;
	transition: opacity .3s;
  }
  .column_card-link:hover {
	color: #333;
	opacity: .7;
  }
  .column_card-thumb {
	position: relative;
  }
  .column_card-thumb::before {
	content: "";
	display: block;
	padding-top: 59.5%;
  }
  .column_card img.column_card-image {
	position: absolute;
	top: 0;
	left: 0;
	max-width: none;
	width: 100%;
	height: 100%;
	object-fit: cover;
	  box-shadow: none;
  }
  .column_card-body {
	padding: 10px 24px 32px;
  }
  .column_card-data {
	font-size: 12px;
	letter-spacing: 0.02em;
	text-align: right;
  }
  #box_column .column_card-title {
	font-size: 20px;
	font-weight: bold;
	line-height: 1.7;
	letter-spacing: 0.025em;
	height: auto;
	padding: 0;
	margin: 0;
	text-align: left;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	  background: none;
  }
  .staff_column .swiper-button-prev {
	left: -64px;
  }
  .staff_column .swiper-button-next {
	right: -64px;
  }

  /* swiper 
---------------------------------------------- */
.swiper_container {
	width:1000px;
	position: relative;
	margin: auto;
}
.swiper_wrap {
	position: relative;
	z-index: 0;
}
.swiper_inner {
	overflow: hidden;
	padding: 20px 20px 50px;
}
.swiper_inner img{
	width: 100%;
	height: auto;
/*	width: 120px;*/
	box-shadow: 0px 0px 10px rgb(0 0 0 / 16%);
}
/* swiper アイコン設定 */
.swiper-button-prev,.swiper-rtl .swiper-button-next {
	left: var(--swiper-navigation-sides-offset, -64px);
}
.swiper-button-next,.swiper-rtl .swiper-button-prev {
	right: var(--swiper-navigation-sides-offset, -64px);
}
.swiper-button-next, .swiper-button-prev {
	width: 45px;
	height: 45px;
}
.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after,
.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after {
	content: ''!important;
	width: 100%;
	height: 100%;
	filter: drop-shadow(0 0 10px rgb(0 0 0 / 16%));
}
.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after {
	background:url("/common/images/slick_ico/ico_slick_arrow_next.png") 0 0 no-repeat;
	background-size: contain;
}
.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after {
	background:url("/common/images/slick_ico/ico_slick_arrow_prev.png") 0 0 no-repeat;
	background-size: contain;
}
/* 年賀状のQ＆A
========================================================================== */
.faq {
	margin-bottom: 96px;
}
.faq .section-title{
	border-bottom: 1px solid #ddd;
	padding-bottom: 40px !important;
}
.faq_item {
	padding: 36px 0;
}
.faq_item{
	border-bottom: 1px solid #ddd;
}
.faq_header {
	display: flex;
	align-items: center;
	cursor: pointer;
}
.faq_header::before {
	content: "Q";
	display: inline-block;
	font-size: 20px;
	font-weight: bold;
	color: #fa2d2d;
	padding-right: 12px;
}
.faq_header::after {
	content: "";
	display: inline-block;
	width: 12px;
	height: 12px;
	margin-left: auto;
	border-bottom: 3px solid #000;
	border-right: 3px solid #000;
	transform: rotate(45deg);
	transition: all 0.3s ease-in-out;
}
.faq_header.is-open::after {
	transform: rotate(225deg);
}
.faq_question {
	font-size: 20px;
    font-weight: bold;
}
.faq_wrap {
	display: none;
}
.faq_body {
	margin-top: 20px;
}
.faq_answer {
	display: flex;
	align-items: center;
	font-size: 20px;
    font-weight: bold;
}
.faq_answer::before {
	content: "A";
	display: inline-block;
	font-size: 20px;
	color: #ffb400;
	padding-right: 12px;
}
.faq_answer-text {
	margin-top: 12px;
}
.faq_link {
	margin-top: 10px;
}

/* 挨拶状ドットコムについて
========================================================================== */
#box_about{
	padding: 96px 0 104px;
	background-color: #F5F5F5;
}
#box_about .about_list {
	display: flex;
	justify-content: space-between;
	gap: 0 48px;
	margin: 40px 0 72px;
}
#box_about .about_item {
	width: 352px;
}
#box_about .about_item img{
	width: 100%;
	height: auto;
}
#box_about .about_item-title {
	font-size: 22px;
	font-weight: bold;
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 28px;
}
#box_about .about_item-text {
	line-height: 1.75;
	letter-spacing: 0.04em;
	margin-top: 16px;
}
#box_about .about_feature {
	margin-top: 72px;
	text-align: center;
}
#box_about .about_feature a img {
	border-radius: 10px;
	box-shadow: 0px 0px 10px rgb(0,0,0,.16);
	transition: opacity .3s;
}
#box_about .about_feature a:hover img {
	opacity: .6;
}
#box_about .about_contain{
	margin-top: 96px;
}
#box_about .about_message {
	display: flex;
	/* justify-content: space-between; */
	gap: 40px;
	margin: 38px auto 0;
}
#box_about .about_message-contents {
	width: calc(100% - 550px);
}
#box_about .about_message-title {
	font-size: 24px;
	font-weight: bold;
	line-height: 1.6em;
	letter-spacing: 0.05em;
	text-align: center;
	background: none;
}
#box_about .about_message-text:first-child{
	margin-top: 0;
}
#box_about .about_message-text {
	line-height: 1.75;
	letter-spacing: 0.04em;
	margin-top: 18px;
}
#box_about .about_group {
	margin-top: 96px;
}
#box_about .about_group-title {
	font-size: 28px;
	font-weight: bold;
	text-align: center;
	letter-spacing: 0.05em;
}
#box_about .about_group-list {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 724px;
	margin: 32px auto 0;
}
#box_about .about_group-item:nth-child(n + 4) {
	margin-top: 20px;
}
#box_about .about_group-item a img {
	box-shadow: 0px 0px 10px rgb(0,0,0,.16);
	transition: opacity .3s;
	border-radius: 8px;
}
#box_about .about_group-item a:hover img {
	opacity: .7;
}
#box_about .group_misara {
	margin-top: 20px;
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 12px;
	font-size: 14px;
}