@charset "utf-8";

@media screen and (min-width:768px) and (max-width:1024px){
	.skirtpoint{
		width: 100%;
	}
}

@media screen and (min-width:768px) and (max-width:1155px){
.po01{
	left: 90px;
	}
}
.po02{
	position: absolute;
	top:0;
	right: 120px;
}
@media screen and (min-width:768px) and (max-width:1155px){
.po02{
	right: 90px;
	}
}
.po03{
	position: absolute;
	bottom: 10px;
	left: 120px;
}
@media screen and (min-width:768px) and (max-width:1155px){
.po03{
	left: 90px;
	}
}


@media screen and (min-width:768px) and (max-width:1155px){
	.sozai{
		width: 94%;
	}
}


@media screen and (min-width:768px) and (max-width:1178px){
.faqlink2{
	  padding-top: 38px;
	}
}


@media screen and (min-width:768px) and (max-width:1155px){
.faqlink2{
	padding-top: 30px;
	}
}
@media screen and (min-width:768px) and (max-width:1024px){
.faqlink2{
	padding-top: 40px;
	}
}

@media screen and (min-width: 768px){
  
.faqlink a {
  display: inline-block;
  padding:5px 30px;
  color: #FFF;
  text-decoration :none;
  background: #848080;
  box-shadow: 3px 3px #bdbdbd;
  transition: .3s;
  font-weight: bold;
}
.faqlink a:hover {
  box-shadow: 1px 1px #bdbdbd;
  background: #000;
  color: #fff;
}
.faqlink2 a {
  display: inline-block;
  padding:5px 30px;
  color: #FFF;
  text-decoration :none;
  background: #848080;
  box-shadow: 3px 3px #bdbdbd;
  transition: .3s;
  font-weight: bold;
}
.faqlink2 a:hover {
  box-shadow: 1px 1px #bdbdbd;
  background: #000;
  color: #fff;
}
.stafftitle{
	width: 40%;
	margin: 100px auto 0;
}
.stafftitle img{
	width: 100%;
}
.stylingstaff{
	width: 80%;
  margin: 50px auto 0;
}
.stylingstaff li{
	width: 22%;
	margin:0 10px;
}
.stylingstaff li img{
	width: 100%;
}
.stylingstaff2{
	width: 80%;
  margin: 80px auto 0;
}
.stylingstaff2 li{
	width: 22%;
	margin:0 10px;
}
.stylingstaff2 li img{
	width: 100%;
}
.stylingdt{
	text-align: center;
	padding-top: 10px;
	font-weight: bold;
}
.stylingbnr{
	display: flex;
	justify-content: space-between;
	width: 90%;
	margin: 100px auto 0;
}
.stylingbnr li{
	width: 48%;
	background: #fdfde8;
	text-align: center;
	font-weight: bold;
	font-size: 18px;
}
.stylingbnr li a{
	display: block;
	padding: 24px;
}
.stylingbnr li a:hover{
	background: #000;
	color: #fff;
}
/* 7/2 */
ul#koukan1 {
  border: 1px solid #bcbcbc;
  padding: 30px;
  margin-top: 20px;
}
ul#koukan1 li {
  width: 18%;
}
ul#koukan1 li img{
  max-width: 110px !important;
}
ul#koukan2 {
  justify-content: center;
  flex-direction: column;
  margin: 0 auto;
  width: 90%;
}
ul#koukan2 li {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0 30px;
  box-sizing: border-box;
  margin-top: 40px !important;
  min-height: 0%;
}
p.koukan-img {
  width: 18% !important;
  max-width: 110px !important;
  margin-right: 5%;
}
.koukan-title{
	margin-top: 5px;
	color: #8A2BE2;
	text-align: center;
	font-weight: bold;
}
.koukan-text-wrap {
  width: 75%;
}
.koukan-text-wrap p{
	text-align: left;
}
p.koukan-img {
  width: 18% !important;
  max-width: 110px;
  margin-right: 5%;
}
.otoiawase{
	margin-top: 40px;
	text-align: center;
}
.returnf{
	width: 40%;
	margin: 30px auto 0;
	background: #eee;
	text-align: center;
	border-radius: 3px;
}
.returnf a{
	display: block;
	padding: 10px;
	border-radius: 3px;
}
.returnf a:hover{
	background: #000;
	color: #fff;
}
.returnf img{
	width: 100%;
}
.koukan {
	border-top: 2px #eee dotted;
	border-bottom: 2px #eee dotted;
	margin-top: 30px;
	padding-bottom: 30px;
	margin-bottom: 30px;
}

/* socks特集 */

.maneritop {
  width: 70%;
  margin: 0px auto;
}
.maneritop img {
  width: 100%;
}
.maneri-text {
  text-align: center;
  margin-top: 30px;
  font-size: 16px;
  line-height: 2;
}
.topbnr{
	width:70%;
	margin: 20px auto;
	border-bottom: 1px solid #222;
	padding-bottom: 50px;
}
.topbnr img{
	width:100%;
}
.codebox{
	margin-top: 50px;
	border-bottom: 1px solid #222;
	padding-bottom: 80px;
}
.codelist{
	display: flex;
	justify-content: space-between;
	width: 80%;
	margin: 0 auto;
	flex-wrap: wrap;
}
.codelist li{
	width: 44%;
	margin-top: 50px;
	position: relative;
}
.codenon{
	text-align: center;
}
.codeitem{
	width: 40%;
	margin: 20px auto 0;
}
.codeitem img{
	width: 100%;
	border-radius: 50%;
}
.codep{
	width: 100%;
	margin: 0 auto 20px;
}
.codep img{
	width: 100%;
	border-radius: 13px;
}
.codetext{
	margin-top: 20px;
}
.codeinbox{
	display: flex;
	justify-content: space-around;
	margin-top: 30px;
}
.codetop{
	text-align: center;
	font-size: 16px;
	font-weight: bold;
}
.codeartist{
	width: 40%;
}
.codeartist img{
	width: 100%;
	border-radius: 50%;
}
.rec-code{
	background: #f5f5f5;
	padding: 16px;
	border-radius: 2%;
	border: 1px solid #888282;
	margin-top: 300px;
}
.codename{
	font-weight: bold;
	width: 50%;
}
.codeinsta{
	margin-top: 10px;
	text-align: right;
	font-weight: bold;
	padding-right: 10px;
}
.codeinstaicon{
	padding-right: 6px;
}
.codenum{
	font-family: 'Rowdies', cursive;
	margin-top: -40px;
  text-align: center;
	font-size: 48px;
}
.osusume {
	position: relative;
	padding: 10px;
	text-align: center;
	font-size: 30px;
	font-weight: bold;
}
.osusume:before {
  position: absolute;
  bottom: -10px;
  left: calc(50% - 30px);
  width: 60px;
  height: 5px;
  content: '';
  border-radius: 3px;
  background: #000;
}
.osusumetext {
  text-align: center;
  margin-top: 40px;
}
.fs-p-snsArea {
	display: flex;
	justify-content:flex-start;
	align-items: flex-end;
	margin-top: 30px;
	float: right;
}
iframe.line-it-button {
  margin-right: 10px;
}
/*
table#u_0_0{
  width:0 !important;
}
*/
iframe#twitter-widget-0 {
    margin-right: 10px;
}
#_rcmdjp_display_1{
	margin:50px 0 30px;
}

/*リニューアルキャンペーンページ*/
.rwh2{
	font-size: 32px;
	text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-weight: normal;
	margin: 35px 0 15px;
	color: #222!important
}
.rwspan{margin-left: 13px;}
.rwtxt{
	text-align: center;
}
.rwtxt p{
	margin-top: 10px;
	font-size: 17px;
	line-height: 2em;
}
.rwpoint{
	justify-content: space-between;
	width: 95%;
	margin: 40px auto;
}
.rwpoint li{
	width: 32%;
	position: relative;
	text-align: center;
	font-size: 1.5vw;
	white-space: nowrap;
	font-weight: bold;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.rwpoint li span{
	position: absolute;
	 top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
}
.rwpoint li span img{
	width: 50%;
	margin: -10% auto 15px;
  filter: drop-shadow(1px 1px 1px #a4a08a);
}
.sozaimain{
	font-weight: bold;
	font-size: 18px;
}
.sozaitext{
	margin-top: 30px;
	line-height: 2.4;
}
.faqtitle{
	width: 34%;
	margin: 0 auto;
}
.faqtitle img{
	width: 100%;
}
.faqbox{
	display: flex;
	justify-content: space-between;
	width: 80%;
  margin: 50px auto 0;
}
.faqmg{
	margin-top: 100px;
}
.circlebg{
	position: relative;
	margin-bottom:20px;
	width: 48%;
}
.circlebg img{
	width:100%;
}
.faqmg {
	padding: 0px 10px;
	position: absolute;
	top: 50%;
	left: 0%;
	transform: translateY(-50%) translateX(0%);
	-webkit-transform: translateY(-50%) translateX(0%);
	margin: auto;
	right: 0;
}
.faqtext{
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	margin-top: 30px;
}
.faqlink{
	text-align: center;
	padding-top: 30px;
}
.faqlink2{
	text-align: center;
	padding-top: 55px;
}
.sozai{
	margin: 80px auto 0;
	width: 80%;
	display: flex;
	justify-content: space-between;
}
.sozaip{
	width: 50%;
}
.sozaip img{
	width: 100%;
}
.sozaibox{
	width: 45%;
	margin-top: 40px;
}
.point-re{
	position: relative;
}
.mainsk{
	margin: 50px auto 0;
	width: 30%;
}
.mainsk img{
	width: 100%;
}
.sktext{
	margin-top: 10px;
	text-align: center;
	font-size: 12px;
}
.pointlist li{
	width: 25%;
}
.sk-p{
	width: 50%;
	margin: 0 auto;
}
.sk-p img{
	width: 100%;
}
.po01{
	position: absolute;
	top:0;
	left: 120px;
}
.type1{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.type2{
	display: flex;
}
.type3{
	display: flex;
	justify-content: space-between;
}
.type4{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.main2top{
  max-width: 1600px;
  margin: 25px auto 0;
}
.type5{
	display: flex;
	align-items: center;
}
#page-top{
  position: fixed;
  bottom: 0px;
  right: 30px;
  z-index: 9999;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: #ccc;
}
#page-top img{
	width: 40px;
	margin: 21px 0 0 20px;
}
.inner{
	width: 1100px;
	margin: 0 auto;
}
.innermgt{
	margin-top: 38px;
}
.feauturebanner li{
	flex: 1;
}
.feauturebanner li:nth-child(2){
	margin-left: 30px;
}
.n-keytitle{
  font-size: 19px;
  letter-spacing: 1px;
  font-weight: normal;
  border-bottom: 1px solid #000;
  padding: 0 0 5px 8px;
}
.keysubtitle{
	font-size: 13px;
  padding-left: 10px;
  color: #ae9bc9;
}
.s-inner{
  width: 780px;
  margin: 15px auto 0;
}
.hotwordbox{
	width: 750px;
  margin: 0 auto 35px;
}
.hotwordbox li,.t-hotwordbox li{
	border-bottom: 1px dashed #727272;
  padding: 15px 10px 13px;
}
.linkbtn{
  text-align: center;
  font-size: 15px;
  letter-spacing: 2px;
  font-family: 'Quicksand', sans-serif;
}
.linkbtn a{
	border: 1px solid #000;
  padding: 6px 0 4px;
  display: block;
}
.slidein-l:before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  content: '';
  background: #000;
  -ms-transform-origin: left top;
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -ms-transform: scale(0, 1);
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transition: transform .5s;
  -moz-transition: transform .5s;
  -o-transition: transform .5s;
  transition: transform .5s;
}
.slidein-l:hover:before {
  -ms-transform-origin: left top;
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -ms-transform: scale(1, 1);
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}
.slidein-l{
	position: relative;
	background: #FFF;
	z-index: 2;
}
.slidein-l:hover{
	color: #fff;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}
.btntype1{
  width: 230px;
  margin: 20px auto 0;
}
.reverse{
	flex-direction: row-reverse;
}
.mainarea{
	width: 850px;
}
.keytitle{
  font-size: 19px;
  letter-spacing: 1px;
  font-weight: normal;
  border-bottom: 1px solid #000;
  padding: 0 0 5px 8px;
}
.new-list{
  margin: 20px auto 50px;
  width: 750px;
}
.new-list li{
	margin: 0 8px;
}
.pr-text{
	font-size: 13px;
	letter-spacing: 1px;
}
.line3{
	width: 31%;
}
.line5{
	width: 18%;
}
.line2list li:nth-child(n+4){
	margin-top: 30px;
}
.r-number,.l-number{
	position: relative;
}
.r-number:before,.l-number:before{
	content: "";
	display: block;
	position: absolute;
	bottom: 50px;
}
.r-number:before{
	width: 22px;
	height: 29px;
	right: 10px;
}
.numberlist li:first-child:before{
	background: url(https://www.farbeco.jp/s/images/farfalle/top/1.png) center center / contain no-repeat;
}
.numberlist li:nth-child(2):before{
	background: url(https://www.farbeco.jp/s/images/farfalle/top/2.png) center center / contain no-repeat;
}
.numberlist li:nth-child(3):before{
	background: url(https://www.farbeco.jp/s/images/farfalle/top/3.png) center center / contain no-repeat;
}
.l-number:before{
	width: 15px;
	height: 22px;
	left: 2px;
}
.numberlist li:nth-child(4):before{
	background: url(https://www.farbeco.jp/s/images/farfalle/top/4.png) center center / contain no-repeat;
}
.numberlist li:nth-child(5):before{
	background: url(https://www.farbeco.jp/s/images/farfalle/top/5.png) center center / contain no-repeat;
}
.numberlist li:nth-child(6):before{
	background: url(https://www.farbeco.jp/s/images/farfalle/top/6.png) center center / contain no-repeat;
}
.numberlist li:nth-child(7):before{
	background: url(https://www.farbeco.jp/s/images/farfalle/top/7.png) center center / contain no-repeat;
}
.numberlist li:nth-child(8):before{
	background: url(https://www.farbeco.jp/s/images/farfalle/top/8.png) center center / contain no-repeat;
}
.line4{
	width: 23%;
}
.b-img{
	height: auto;
}
.b-day{
	margin-top: 10px;
}
.recoitem li{
	width: 31%;
}
.farmore {
  text-align: center;
  font-size: 15px;
  width: 300px;
  margin: 0 auto;
}
.farmore a {
  display: block;
  padding: 10px 0 8px;
  border: 1px solid #ae9bc9;
  background: #ae9bc9;
  color: #fff;
}
.farmore a:hover {
  color: #ae9bc9;
  background: #fff;
}
.b-point:before{
  position: absolute;
  top: 6px;
  left: 0px;
  content: '';
  width: 8px;
  height: 8px;
  background-color: #000;
}
.bigred{
	color: #e95459;
  font-size: 20px;
}
.t-keysubtitle{
	font-size: 13px;
  padding-left: 10px;
}
.t-hotwordbox{
	width: 825px;
  margin: 0 auto 35px;
}
.t-numberlist li:before{
	content: "";
	display: block;
	position: absolute;
	width: 44px;
	height: 44px;
	left: 0;
	top: 0;
}
.t-numberlist li:nth-child(n+4):before{
	width: 29px;
  height: 29px;
}
.t-numberlist li:first-child:before{
	background: url(https://www.farbeco.jp/s/images/trecode/top/1.png) center center / contain no-repeat;
}
.t-numberlist li:nth-child(2):before{
	background: url(https://www.farbeco.jp/s/images/trecode/top/2.png) center center / contain no-repeat;
}
.t-numberlist li:nth-child(3):before{
	background: url(https://www.farbeco.jp/s/images/trecode/top/3.png) center center / contain no-repeat;
}
.t-numberlist li:nth-child(4):before{
	background: url(https://www.farbeco.jp/s/images/trecode/top/4.png) center center / contain no-repeat;
}
.t-numberlist li:nth-child(5):before{
	background: url(https://www.farbeco.jp/s/images/trecode/top/5.png) center center / contain no-repeat;
}
.t-numberlist li:nth-child(6):before{
	background: url(https://www.farbeco.jp/s/images/trecode/top/6.png) center center / contain no-repeat;
}
.t-numberlist li:nth-child(7):before{
	background: url(https://www.farbeco.jp/s/images/trecode/top/7.png) center center / contain no-repeat;
}
.t-numberlist li:nth-child(8):before{
	background: url(https://www.farbeco.jp/s/images/trecode/top/8.png) center center / contain no-repeat;
}
.t-numberlist li{
	position: relative;
}
/* kubonbon */
.feat-inner{
	width: 1050px;
	padding: 0 65px;
	margin-left: auto;
	margin-right: auto;
}
.feat-list{
	border: 1px solid #eee;
	padding: 60px 100px;
}
.feat-list>p,.feat-list>div{
	width: 47%;
}
.feat-text{
	font-size: 15px;
	line-height: 1.8em;
}
.b-headingt{
	font-size: 22px;
	text-align: center;
}
.feat-list>div>p{
	margin-top: 20px;
}
.feat-itemlist li{
	width: 30%;
	margin-right: 5%;
}
.feat-itemlist li:last-child{
	margin-right: 0;
}
.b-item-name{
	font-weight: bold;
	font-size: 16px;
}
.feat-itemlist .b-item-name{
	margin-top: 7px;
}
.r-price{
	float: right;
	font-size: 16px;
}
.feat-itemlist .r-price{
	margin-top: 10px;
}
/* 会社概要 */
.big-keytitle{
	font-size: 22px;
  letter-spacing: 1px;
  border-bottom: 1px solid #000;
  padding-bottom: 5px;
}
.company{
	padding: 20px;
}
.company th{
	width: 250px;
	font-weight: normal;
}
.company td{
	width: 560px;
}
.company th,.company td{
	padding: 15px 0;
	border-bottom: 1px dashed #ccc;
}
.company i{
	margin-left: 15px;
}
.modal-open:hover {
  cursor: pointer;
}
.modal-wrap {
  z-index: 2;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.modal-content {
  position: relative;
  display: none;
  z-index: 20;
  width: 50%;
  height: 96vh;
  left: 0 !important;
  margin: 15px auto;
  padding: 30px 20px;
}
.modalimgbox{
	width: auto;
	height: 80vh;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-55%);
	-ms-transform: translate(-50%,-55%);
	-webkit-transform: translate(-50%,-55%);
}
.modalimg{
	height: 80vh;
}
.modal-text{
	position: absolute;
	bottom: -35px;
	color: #fff;
}
.modal-cbtn{
	position: absolute;
	bottom: -35px;
	right: 0;
}
.modal-cbtn a{
	color: #fff;
}
.modal-overlay {
  z-index:1;
  display:none;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:120%;
  background: rgba(0,0,0,0.75);
}
.modal-close {
  margin-top: 30px;
  text-align: center;
}
.modal-close a {
  text-decoration: underline;
  font-weight: bold;
  font-size: 13px;
}
.company-photo{
	margin-top: 10px;
	overflow: hidden;
}
.company-photo li{
	margin-right: 2px;
	height: 112px;
}
.company-photo li:last-child{
	margin-right: 0;
}
.company01{
	position: relative;
	top:-108px;
}
.company04{
	position: relative;
	top:-134px;
}
.history-t{
	padding: 40px 20px 0;
}
.history{
	flex: 1;
}
.history th,.history td{
	padding: 7px 0;
}
.history th{
	width: 100px;
	text-align: left;
}
/* ファルファーレ・トレコードfaq */
.inpagelink li{
	margin-right: 25px;
}
.inpagelink i{
	margin-right: 5px;
}
.inpagelink li:last-child{
	margin-right: 0;
}
.bg-title{
	font-size: 18px;
  background: #eee;
  padding: 6px 10px 4px;
  border-radius: 3px;
}
.attentionred{
	font-weight: bold;
	font-size: 16px;
	color: #e95459;
}
dl.faqlist{
	margin-top:25px;
}
.faqlist dt:before,.faqlist dd:before{
	display: inline-block;
  width: 29px;
  height: 22px;
  border-radius: 3px;
  text-align: center;
  border: 1px solid #000;
  padding: 3px 0 3px;
  position: absolute;
  top: -5px;
  left: 0;
}
.faqlist dt:before{
	content: "Q";
  background: #000;
  color: #fff;
}
.faqlist dt{
	font-weight: bold;
}
.faqlist dt,.faqlist dd{
	position: relative;
	padding-left: 45px;
}
.faqlist dd:before{
	content: "A";
  background: #fff;
  color: #000;
}
.faqlist dd{
  border-bottom: 1px dashed #8d8d8d;
  padding-bottom: 25px;
  margin-top:30px;
  margin-bottom:30px;
}
.faq-attention{
	margin-top: 5px;
	display: block;
}
.faqlist input{
	display: none;
}
.opabox{
	height: 0;
  padding: 0;
  opacity: 0;
  transition: 0.8s;
}
.faqlist input:checked ~ .opabox {
	margin-top: 30px;
  height: auto;
  opacity: 1;
}
.movie{
  width: 80%;
  padding-bottom: 45%;
  height:0px;
  position: relative;
}
.movie iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.middletext{
	font-weight: bold;
  font-size: 17px;
  border-bottom: 1px solid #bebebe;
}
.putib-text{
	font-weight: bold;
  font-size: 16px;
}
.sokutyo-l{
	width: 420px;
	margin-right: 20px;
}
.sokutyo-r{
	width: 200px;
}
.sizetable{
	width: 100%;
	border-left: 1px solid #E2D6E2;
	margin-top: 30px;
}
.sizetable th,.sizetable td{
	text-align: center;
}
.sizetable th{
	background: #E2D6E2;
	padding: 10px 0;
}
.sizetable td{
	border-right: 1px solid #E2D6E2;
	border-bottom: 1px solid #E2D6E2;
	padding: 5px 0;
}
.sokutyo-bn{
	width: 500px;
  margin: 35px auto 50px;
}
.fargimg{
	margin: 10px 0 5px;
	width: 30%;
}
.red{
	color: #e50000;
}
/* ガイドページ */
.black-ptitle{
	font-size: 21px;
  padding: 0 0 3px 28px;
  position: relative;
  border-bottom: 1px dashed #aaaaaa;
}
.black-ptitle:before{
	content: '';
  width: 12px;
  height: 6px;
  display: inline-block;
  background: #000;
  position: absolute;
  top: 14px;
  left: 8px;
}
.text-secbox{	margin-top: 20px;
	padding-bottom: 30px;
}
.text-secbox .bg-title{
	margin-bottom: 20px;
}
.amazonbn{
	width: 200px;
}
.credit{
	width: 625px;
}
.b-strongt{
	font-size: 18px;
	font-weight: bold;
}
.paytable th{
	font-size: 15px;
	font-weight: bold;
	text-align: left;
	padding: 10px 20px;
}
.spanblank{
	display: block;
	margin-top: 20px;
}
.conveni{
	width: 360px;
}
.time{
	width: 450px;
}
.sendtable{
	width: 100%;
	table-layout: fixed;
	border-left: 1px solid #bcbcbc;
	border-bottom: 1px solid #bcbcbc;
}
.sendtable th,.sendtable td{
	border-right: 1px solid #bcbcbc;
	border-top: 1px solid #bcbcbc;
	padding: 10px 0;
}
.sendtable th,.sendtable tr td:last-child{
	width: 100px;
}
.sendtable tr td:nth-child(2){
	padding-left: 10px;
}
.sendtable th{
	font-size: 15px;
}
.sendtable tr td:last-child{
	text-align: center;
}
.bold18t{
	font-size: 18px;
	font-weight: bold;
}
.koukanlist li{
	margin-top: 20px;
	width: 23%;
}
.koukanlist li p:last-child{
	margin-top: 10px;
}
.pink{
	color: #C53E90 !important;
}
.textlist li{
	margin-top: 15px;
}
.dotlist li {
  list-style-type: square !important;
  margin: 5px 0 0 30px;
}
/* ファルファーレについて */
.fa-aboutarea{
	margin: 0px auto 0;
	background-color: #e2d6e2;
	background-image: url(https://www.farbeco.jp/s/images/farfalle/concept/bg1.png),url(https://www.farbeco.jp/s/images/farfalle/concept/bg2.png),url(https://www.farbeco.jp/s/images/farfalle/concept/bg_ribbon.png);
	background-repeat: no-repeat;
	border-radius: 10px;
	background-position: left 15% top,right 15% top,center top 30px;
	padding-bottom: 50px;
}
.far-cmaint{
	font-size: 17px;
  letter-spacing: .15em;
  color: #9999cc;
  padding-top: 30px;
  text-align: center;
}
.far-clogo{
	width: 280px;
	margin: 28px auto 0;
}
.far-ringimg{
	width: 80%;
	max-width: 800px;
	margin: 20px auto 0;
	-webkit-transition: transform 20s linear;
	-moz-transition: transform 20s linear;
	-o-transition: transform 20s linear;
	transition: transform 20s linear;
}
.far-ringimg:hover{
transform: rotate(360deg);
-ms-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
}
.fa-aboutarea h4{
	font-size: 46px;
  font-family: 'parisienne', cursive;
  border-bottom: 2px solid #AE9BC9;
  color: #AE9BC9;
  font-weight: 100;
  letter-spacing: 3px;
  padding-bottom: 10px;
  margin-bottom: 35px;
}
.far-ainner{
	width: 600px;
	margin: 40px auto 0;
	text-align: center;
}
.col-ptext{
	font-family: "游明朝体","YuMincho";
  font-size: 18px;
  color: #AE9BC9;
  line-height: 4em;
  letter-spacing: 2px;
}
.far-secmaint{
	font-size: 18px;
  color: #AE9BC9;
  line-height: 1.8em;
  font-weight: bold;
  letter-spacing: 2px;
}
.far-sect{
	color: #373737;
  letter-spacing: .15em;
  line-height: 1.8em;
  margin: 15px 0 10px 0;
}
.insoleimg{
	width: 480px;
	margin: 0 auto;
}
.far-conlist{
	margin: 70px auto 0;
	width: 90%;
}
.far-conlist li{
	width: 30%;
}
.far-conlist li p:first-child{
	margin: 0 auto;
	width: 80%;
}
.far-conlist li p:nth-child(2){
	font-size: 18px;
  color: #AE9BC9;
  line-height: 1.8em;
  font-weight: bold;
  letter-spacing: 2px;
  text-align: center;
  margin-top: 30px;
}
.far-conlist li:last-child p:nth-child(2){
	padding: 16px;
}
.far-conlist li p:nth-child(3){
	color: #373737;
  letter-spacing: .15em;
  line-height: 1.8em;
  margin: 15px 0 10px 0;
  text-align: center;
  margin-top: 20px;
}
.far-conlist li p:nth-child(4){
	text-align: center;
	font-size: 12px;
  color: #B78AE8;
  background: #fff;
  border-radius: 6px;
  padding: 5px 5px 4px;
  margin-top: 15px;
}
/* コンタクト */
.form-secarea form{
	width: 518px;
	margin: 50px auto 0;
}
.form-maint{
	font-size: 17px;
	margin-top: 20px;
}
.form-secarea .red{
	font-size: 12px;
	padding-left: 10px;
}
.input01 input{
	width: 100%;
	font-size: 14px;
  padding: 10px 8px 8px;
  border: 1px solid #ccc;
  border-radius: 3px;
  margin-top: 10px;
  outline: none;
  box-sizing: border-box;
}
.form-textbox textarea{
	width: 100%;
  height: 200px;
	border-radius: 3px;
  padding: 10px;
  margin-top: 10px;
  font-size: 14px;
  color: #000;
  border: 1px solid #ccc;
  outline: none;
  box-sizing: border-box;
}
.conbtn{
	width: 250px;
  margin: 30px auto 0;
}
.conbtn input {
  background: #000;
  width: 100%;
  color: #fff;
  font-size: 15px;
  padding: 6px 0 4px;
  display: block;
  border-radius: 3px;
  outline: none;
}
/* special */
.tokusyuPage {
  width: 900px;
  margin: 0 auto;
}
.tokusyutext {
  font-size: 15px;
  line-height: 1.9em;
  text-align: center;
  margin-top: 20px;
}
.tokusyuPage h4 {
  font-size: 22px;
  text-align: center;
  margin-bottom: 20px;
}
.tokusyutext {
  line-height: 1.8em;
}
.fftc{
	padding-top: 235px;
}
.special {
  width: 900px;
  margin: 0 auto;
}
.specialimg img{
	width: 100%;
}
.special h3{
	margin: 20px 0;
	line-height: 1.5;
	font-weight: bold;
	font-size: 25px;
  text-align: center;
  }
.item-box{
	display: flex;
	justify-content: space-between;
	margin-top: 60px;
	border: 1px solid #eee;
	padding: 60px 100px;
}
.item-photo{
	width: 340px;
}
.item-photo img{
	width: 100%;
}
.item-photo iframe{
	max-width:100%;
}
.item-detail{
	width: 310px;
}
.item-list{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-top: 60px;
	letter-spacing: .1em;
}
.item-list li{
	width:30%;
	margin-right:5%;
	margin-bottom:18px;
}
.item-list li:nth-child(3n){
	margin-right:0;
}
.list-photo img{
	width: 100%;
}
.item-text{
	padding: 0 5px;
	font-size: 13px;
}
.item-list h5,
.item-price{
	font-size: 16px;
	padding: 5px;
}
.item-price{
	text-align: right;
}
.itembnlist{
	width:70%;
	max-width:580px;
	margin:20px auto;
}
.itembnlist li{
	margin-bottom:6px;
}
.itembnlist li img{
	width:100%;
	vertical-align: bottom;
}
.item-box.column2{
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.item-box.column2 .flowarea{
	width: 100%;
	margin-top:40px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}
.itemflow{
	flex:5;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-right: 35px;
}
.itemflow li{
	width:30%;
	margin-right:5%;
	margin-bottom:15px;
	font-size: 12px;
}
.itemflow li:nth-child(3n){
	margin-right:0;
}
.itemflow li img{
	width:100%;
}
.carelist{
	flex:1;
}
.carelist li{
	margin-bottom:7px;
	font-size: 11px;
}
.carelist li img{
	width:100%;
}
.fs-c-variationList__item .fs-c-variationList__item__body{display:none;}
.fs-c-variationList__item__title{cursor: pointer;}
.fs_ReturnPolicy a{
	color: #136cbf;
}
.shopguidelink{
	font-size: 16px;
	margin:15px 0;
}
/* フリーテストページ02 （佐俣）*/
.farfalle-catch{
	font-size: 16px;
	width: 800px;
	margin: 30px auto 0;
}
.introduction-erea{
	border-bottom: solid 1px;
  padding: 80px 0;
}
.bor-no{
	border-bottom: none;
}
.coordination-list{
	display: flex;
	justify-content: space-between;
}
.coordination-list li{
	width: 31%;
}
.topic-erea{
	display: flex;
	justify-content: space-between;
	margin-top: 60px;
}
.topic-box{
	width: 70%;
}
.topic-box h3{
	font-size: 20px;
	text-align: center;
}
.topic-box p{
	font-size: 16px;
	margin-top: 12px;
}
.product-link{
	width: 26%;
}
.insta-erea h3{
	font-size: 26px;
	text-align: center;
	letter-spacing: 1px;
}
.insta-list{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-top: 30px;
}
.insta-list li{
	width: 32%;
	margin-bottom: 20px;
}
.linkbtn {
  text-align: center;
  font-size: 15px;
  letter-spacing: 2px;
  font-family: 'Quicksand', sans-serif;
}
.btntype1 {
  width: 230px;
  margin: 30px auto 0;
}
.linkbtn a {
  border: 1px solid #000;
  padding: 6px 0 4px;
  display: block;
}
.linkbtn a:hover {
  color: #fff;
  background: #000;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
.farfalle-link{
	margin-top: 80px;
}

/* ss2020 ranking */

.ssranking{
	display: flex;
	justify-content: space-between;
	width: 100%;
	flex-wrap: wrap;
}
.ssranking li{
	width: 48%;
	margin-top: 30px;
}
/*
.ssranking li:nth-child(n+3){
	margin-top: 30px;
}
*/
.ssranking li img{
	width: 100%;
}
.rankingdetails{
	margin-top: 30px;
}
.detail{
	margin-top: 10px;
}
.pccenter{
	text-align: center;
}
.tac10{
	text-align: center;
	margin-top: 10px;
}


/* coordinate LP */


.maneritop{
	width: 70%;
	margin: 0 auto;
}
.maneritop img{
	width: 100%;
}
.maneri-text{
	text-align: center;
	margin-top: 30px;
	font-size: 14px;
	line-height: 2.0;
}
.ideabox{
	margin-top: 80px;
}
.ideatop{
	font-size: 22px;
	border-bottom: 1px solid #000;
	padding-bottom: 4px;
	text-align: center;
	width: 60%;
	margin: 0 auto;
}
.ideadetail{
	width: 80%;
	margin: 50px auto 0;
	display: flex;
	justify-content: space-between;
}
.styling{
	width: 60%;
}
.styling img{
	width: 100%;
}
.stylingdetail{
	width: 40%;
}
.itemlist{
	display: flex;
	justify-content: space-between;
}
.itemlist li{
	width: 45%;
}
.itemlist li a{
	display: block;
}
.itemlist li img{
	width: 100%;
}
.linkcheck {
  text-align: center;
  margin-top: 20px;
  background: #000;
  border-radius: 6px;
  color: #fff;
  font-size: 16px;
	border:1px solid #000;
	box-sizing: border-box;
}
.linkcheck2{
  text-align: center;
  margin-top: 26px;
  background: #000;
  border-radius: 6px;
  color: #fff;
  font-size: 16px;
	border:1px solid #000;
	box-sizing: border-box;
}
.linkcheck:hover{
	color: #000;
	background: #fff;
}
.linkcheck2:hover{
	color: #000;
	background: #fff;
}
.stylingtext{
	margin-top: 20px;
	font-size: 13px;
}
.sutekipoint{
	margin-top: 100px;
	background: #fdfde8;
}
.skinner{
	width: 85%;
	max-width: 1150px;
	margin: 0 auto 80px;
	padding: 70px 0;
}
.skirtpoint{
	text-align: center;
	color: #848080;
	font-size: 26px;
	font-weight: bold;
}
.skirtpoint span {
  position: relative;
}
.skirtpoint span:before,
.skirtpoint span:after {
  content: "";
  border-bottom: 2px solid #848080;
  width: 45px;
  margin: 0 15px;
  position: absolute;
  bottom: 13px;
}
.skirtpoint  span:before {
  right: 100%;
}
.skirtpoint  span:after {
  left: 100%;
}
}
@media screen and (max-width: 767px){
  
/*リニューアルキャンペーンページ*/
.rwh2{
	font-size: 22px;
	text-align: center;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-weight: normal;
	margin: 25px 0 15px;
	white-space: nowrap;
	letter-spacing: 2px;
	line-height: 1.4em;
	color: #222!important;
}
.rwtxt.spinner{
	margin: 0 auto 25px;
}
.rwspan{
	display: block;
}
.rwtxt p{
	margin-top: 10px;
	line-height: 1.8em;
}
.rwpoint.flexlist{
	display: block;
}
.rwpoint li{
	text-align: center;
	font-size: 15px;
	font-weight: bold;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 15px;
}
.rwpoint li>img{
	width: 95px;
	margin-right: 20px;
  filter: drop-shadow(1px 1px 1px #a4a08a);
}
.rwpoint li span{
	display: block;
	text-align: left;
	white-space: nowrap;
	width: 210px;
	color: #868767;
	position: relative;
}
.rwpoint li span img{
	left: -92px;
  position: absolute;
  top: 9px;
  width: 50px;
}
.rwpoint li:nth-child(2) span img{
	width: 66px;
	top: -9px;
	left: -101px;
}
}

.campaign{
	background:#eeeae85c;
}
.rwh2-2 span{
	position: relative;
	border: solid 2px #878768;
	background: #fff;
	z-index: 10;
	color: #222!important;
}
.rwh2-2 span::before{
	content: "";
	position: absolute;
	background: url(https://www.farbeco.jp/s/images/renewal/rwh2-3.svg) no-repeat;
	background-size: 100%;
	z-index: -1;
}
.rwh2-2 span::after{
	content: "";
	position: absolute;
	background: url(https://www.farbeco.jp/s/images/renewal/rwh2-4.svg) no-repeat;
	background-size: 100%;
	z-index: -1;
}
.rwperiod{
	text-align: center;
	font-weight: bold;
	color: #fff;
	outline:  solid 1px #fff;
	background: #e2c825;
}
.rwnote{
	margin: 20px 0;
	font-weight: bold;
}
.rwcampaign{
	background: #fff;
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: #fff7c9;
	max-width: 900px;
	margin: 40px auto 0;
  box-shadow: 1px 1px 10px #a4a08a;
}
.rwcampaign2{
	background: #e2e2da;
}
.tokuten{
	font-weight: bold;
	vertical-align: middle;
	position: relative;
	z-index: 10;
}
.tokuten::before{
	content: "";
	position: absolute;
	background: url(https://www.farbeco.jp/s/images/renewal/t1.png) no-repeat;
	 top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit-transform: translateY(-50%) translateX(-50%);
	background-size: 100%;
	z-index: -1;
}
.tokuten span{
	margin-bottom: -10px;
	display: inline-block;
}
.tokutentxt{
	flex: 1;
	text-align: center;
}	
.tt1{
	font-weight: bold;
	color: #868767;
}
.tt2{
	font-weight: bold;
	line-height: 1.5em;
}
.tokuten_w{
	text-align: center;
	font-weight: bold;
	color: #d484c3;
}
.tokuten_w span{
	position: relative;
}
.tokuten_w span::before{
	content: "";
	position: absolute;
	background: url(https://www.farbeco.jp/s/images/renewal/check1.svg) no-repeat;
	background-size: 100%;
	z-index: -1;
}
.tokuten_w span::after{
	content: "";
	position: absolute;
	background: url(https://www.farbeco.jp/s/images/renewal/check2.svg) no-repeat;
	background-size: 100%;
	z-index: -1;
}
.rwmember h2{
	text-align: center;
	padding: 10px;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-weight: normal;
	position: relative;
}
.rwmember h2 span{
	border-bottom: dotted 3px #bfbfae;
	display: inline-block;
	color: #222!important;
}
.rwmember li{
	display: flex;
	justify-content: center;
}
.rwmember h3{
	font-weight: bold;
}
.rwmember li p:first-child img{
	border-radius: 50%;
	border: solid 3px #bfbfae;
}
.rwlast{
	font-weight: bold;
	position: relative;
	color: #868767;
}
.rwlast span{
	color: #e2c826;
}
.rwlast::before{
  font-family: "Font Awesome 5 Free";
  font-weight: 700;
  content: "\f055";
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  color: #bab9a1;	
}
.rwlast::after{
	content: "";
	position: absolute;
	background: url(https://www.farbeco.jp/s/images/renewal/plus.jpg) no-repeat;
	left: 0;
	background-size: 100%;
	z-index: -1;
}

@media screen and (min-width: 768px){
  .campaign{
    padding: 40px 60px 45px;
    margin-top: 80px;
    border: solid 1px #bfbfae;
    border-radius: 5px;
  }
  .rwh2-2{
    margin-bottom: 60px;
  }
  .rwh2-2 span{
    padding: 17px 60px 15px;
  }
  .rwh2-2 span::before{
    left: -49px;
    width: 60px;
    height: 60px;
    bottom: -15px;
  }
  .rwh2-2 span::after{
    right: -49px;
    width: 60px;
    height: 60px;
    bottom: -15px;
  }
  .rwperiod{
    font-size: 30px;
    padding: 25px 0 23px;
    outline-offset: -10px;
  }
  .rwperiod .span1{
    margin-right: 30px;
  }
  .rwnote{
    text-align: center;
    font-size: 18px;
    padding-bottom: 50px;
    border-bottom: dotted 3px #8c8e6c;
  }
  .tokuten{
    margin-right: 40px;
    font-size: 30px;
  }
  .tokuten::before{
    width: 150px;
    height: 150px;
  }
  .tokuten span{
    font-size: 30px;
    margin-left: 10px;
  }
  .tt1{
    font-size: 18px;
  }
  .tt2{
    font-size: 30px;
    margin: 5px 0 15px;
  }
  .tt3{
    font-size: 17px;
  }
  .tt4{
    font-size: 16px;
    margin-bottom: 20px;
  }
  .tokuten_w{
    font-size: 28px;
    margin-top: 70px;
  }
  .tokuten_w span::before{
    width: 32px;
    height: 110px;
    top: -20px;
    left: -90px;
  }
  .tokuten_w span::after{
    width: 32px;
    height: 110px;
    top: -20px;
    right: -70px;
  }
  .rwmember{
    margin-top: 50px;
  }
  .rwmember h2{
    margin-bottom: 20px;
    font-size: 35px;
  }
  .rwmember h2 span{
    padding: 0 50px 10px;
  }
  .rwmember ul{
    width: 695px;
    margin: 0 auto;
  }
  .rwmember li{
    align-items: center;
    margin-top: 30px;
  }
  .rwmember h3{
    font-size: 23px;
    margin-bottom: 15px;
  }
  .rwmember li p:first-child{
    width: 150px;
    margin-right: 35px;
  }
  .rwmember li div{
    width: 500px;
  }
  .rwmemtxt{
    font-size: 17px;
  }
  .rwlast{
    font-size: 25px;
    text-align: center;
    margin: 130px auto 80px;
    width: 750px;
  }
  .rwlast span{
    padding: 0 10px;
    font-size: 30px;
  }
  .rwlast::after{
    width: 160px;
    height: 300px;
    top: -45px;
  }
}
@media screen and (max-width: 767px){
  .campaign{
    padding: 25px 5% 30px;
    margin-top: 40px;
    border-top: solid 1px #e0e0d8;
    border-bottom: solid 1px #e0e0d8;
    overflow: hidden;
  }
  .rwh2-2{
    margin-bottom: 45px;
    white-space: nowrap;
    font-size: 18px;
  }
  .rwh2-2 span{
    padding: 15px 10px 13px;
    letter-spacing: -1px;
  }
  .rwh2-2 span::before{
    left: -37px;
    width: 45px;
    height: 44px;
    bottom: -10px;
  }
  .rwh2-2 span::after{
    right: -37px;
    width: 45px;
    height: 44px;
    bottom: -10px;
  }
  .rwperiod{
    font-size: 19px;
    padding: 17px 0 15px;
    outline-offset: -7px;
    line-height: 1.4em;
  }
  .rwperiod .span1{
    font-size: 16px;
    display: block;
  }
  .rwperiod .span2{
    font-size: 15px;
  }
  .rwnote{
    margin: 20px 0;
    font-weight: bold;
  }
  .rwcampaign{
    padding: 22px 15px 15px;
    box-shadow: 1px 1px 6px #a4a08a;
    position: relative;
  }
  .tokuten{
    position: absolute;
    top: 5px;
    left: 5px;
  }
  .tokuten::before{
    width: 70px;
    height: 70px;
  }
  .tokuten span{
    font-size: 15px;
    margin-left: 5px;
  }
  .tt2{
    font-size: 18px;
    margin: 5px 0 8px;
    white-space: nowrap;
  }
  .tt3{
    text-align: left;
  }
  .tt4{
    font-size: 13px;
    text-align: left;
  }
  .tokuten_w{
    font-size: 16px;
    margin-top: 30px;
    white-space: nowrap;
  }
  .tokuten_w span::before{
    width: 10px;
    height: 35px;
    top: 3px;
    left: -28px;
  }
  .tokuten_w span::after{
    width: 10px;
    height: 35px;
    top: 3px;
    right: -10px;
  }
  .rwmember{
    margin-top: 15px;
  }
  .rwmember h2{
    font-size: 20px;
    margin-bottom: 30px;
  }
  .rwmember h2 span{
    padding: 0 25px 5px;
    letter-spacing: 2px;
    line-height: 1.4em;
    font-weight: bold;
  }
  .rwmember li{
    margin-top: 25px;
  }
  .rwmember h3{
    font-size: 15px;
    margin-bottom: 7px;
    white-space: nowrap;
  }
  .rwmember li p:first-child{
    width: 85px;
    margin-right: 15px;
  }
  .rwmember li div{
    flex: 1;
  }
  .rwlast.spinner{
    font-size: 15px;
    margin: 90px auto 35px;
  }
  .rwlast span{
    padding: 0 5px;
    font-size: 19px;
  }
  .rwlast::before{
    top: -78px;
    font-size: 40px;
    text-align: center;
  }
  .rwlast::after{
    width: 90px;
    height: 35px;
    top: -28px;
  }
}

.readmore_rw{
  text-align: center;
  font-weight: bold;
  background: #fff7c9;
  position: relative;
 }
 .readmore_rw2{
  background: #d9eff0;
 }
 .readmore_rw a{
	display: block;
}
.readmore_rw i{
	position: absolute;
}
.readmore_rw3{
	text-align: center;
}
.readmore_rw3 a{
	border-bottom: solid 1px #868767;
	color: #868767;
	display: inline-block;
}
.readmore_rw3 a:hover{
	opacity: .8;
}

@media screen and (min-width: 768px){
  .readmore_rw{
    width: 700px;
    margin: 40px auto 0;
    font-size: 25px;
   }
   .readmore_rw a{
    padding: 27px 0 25px;
  }
  .readmore_rw i{
    top: 35px;
    right: 50px;
    font-size: 30px;
  }
  .readmore_rw3{
    font-size: 18px;
    margin-top: 80px;
  }
}
@media screen and (max-width: 767px){
  .readmore_rw{
    width: 80%;
    margin: 20px auto 0;
    font-size: 15px;
    box-shadow: 1px 1px 6px #a4a08a;
   }
   .readmore_rw a{
    padding: 17px 0 15px;
  }
  .readmore_rw i{
    top: 20px;
    right: 12px;
    font-size: 15px;
  }
  .readmore_rw3{
    margin-top: 40px;
  }
}
@media screen and (min-width: 770px){
  .rwcampaign{padding: 30px 5% 20px 10%;}
}
@media screen and (min-width:1300px){
  .rwpoint li{font-size: 20px;}
  }
@media screen and (min-width:768px) and (max-width:1000px){
  .rwpoint li{font-size: 16px;}
  .rwperiod{font-size: 28px;padding: 20px 0;}
  .rwperiod .span1{display: block;margin-left: 0;font-size: 25px;}
  .campaign{padding: 45px 40px;}
  .rwnote{font-size: 17px;white-space: nowrap;}
  .rwmember h2{font-size: 32px;}
  .rwpoint li span img{margin-bottom: 8px;}
}
@media screen and (min-width:768px) and (max-width:900px){
  .rwcampaign{padding: 30px 2.5% 20px 7%;}
  .tokuten{font-size: 27px;white-space: nowrap;}
  .tt2{font-size: 27px;}
  .tt3{font-size: 16px;}
  .tt4{font-size: 15px;white-space: nowrap;}
  .rwpoint li{font-size: 15px;}
}
@media screen and (max-width:400px){
  .rwperiod{font-size: 17px;}
  .tokuten{top: 0;left: 0;}
  .tokuten_w{font-size: 15px;}
}
@media screen and (max-width:350px){
  .rwperiod .span1{font-size: 15px;}
  .rwperiod .span2{font-size: 14px;}
  .rwpoint li>img{width: 80px;}
  .rwpoint li span{font-size: 13px;letter-spacing: 0;}
  .rwpoint li span img{left: -79px;width: 40px;top: 15px;}
  .rwpoint li:nth-child(2) span img{left: -90px;width: 60px;top: -6px;}
  .rwh2-2{font-size: 16px;}
  .rwh2-2 span{padding: 15px 5px 13px;font-size: 15px;}
  .readmore_rw{font-size: 14px;letter-spacing: 0;}
}

/*レビューページ*/

#freview .reviewtop{
	position: relative;
}
#freview .reviewarea{
	margin: 0 auto;
}
#freview .catch1{
	position: relative;
}
#freview .catch1 span{
	font-weight: bold;
	display: inline-block;
	position: relative;
}
#freview .catch1 span::before{
	content: "";
	background: url(https://www.farbeco.jp/s/images/review/dotteline.svg) no-repeat;
	background-size: 100%;
	width: 100%;
	height: 80px;
	left: 0;
	position: absolute;
}
#freview h2 span{
	font-weight: bold;
	display: inline-block;
	background: #de965b;
	text-align: center;
	color: #fff;
	position: relative;
	white-space: nowrap;
}
#freview h2 span::before{
	content: "";
	background-size: 100%;
	width: 40px;
	top: 0;
	position: absolute;
}
#freview h2 span::after{
	content: "";
	background-size: 100%;
	width: 40px;
	top: 0;
	position: absolute;
}
#freview .text1{
	font-weight: bold;
	color: #747062;
}
#freview .voicearea h3{
	position: relative;
	font-weight: bold;
	margin-bottom: 20px;
}
#freview .voicearea h3::before{
	height: 1px;
	width: 100%;
	background: #b6b29d;
	content: "";
	position: absolute;
	left: 0;
	z-index: -1;
}
#freview .voicearea h3 span{
	background: #fff;
}
#freview .voicearea h3 i{
	color: #bab9a1;
	margin-left: 5px;
}
#freview .voicelist li{
	background: #fff;
	position: relative;
	font-weight: bold;
}
#freview .voicelist li::before{
	content: "";
	background: url(https://www.farbeco.jp/s/images/review/tepe.png) no-repeat;
	background-size: 100%;
	height: 80px;
	left: 0;
	right: 0;
	margin: auto;
	position: absolute;
}
#freview .reviewflex1 .staffimg2{
	position: relative;
}
#freview .reviewflex1 .staffimg2::before{
	content: "";
	border-top: dotted 3px #3d3d3d;
	background-size: 100%;
	width: 40px;
	position: absolute;
}
#freview .reviewflex1 .staffimg2::after{
	content: "";
	border-top: dotted 3px #3d3d3d;
	background-size: 100%;
	width: 40px;
	position: absolute;
}
#freview .reviewflex1 .staffimg2::after{
	left: -60px;
	bottom: 10%;
	transform: rotateZ(-25deg);
}
#freview .reviewflex1 .flex1 span{
	font-weight: bold;
	color: #de965b;
}
#freview .reviewpoint{
	background: #84d2d7;
	color: #fff;
}
#freview .reviewpoint .span1{
	color: #fffc63;
	display: block;
}
#freview .reviewpoint .span2{
	font-weight: normal;
}
#freview .reviewflow{
	background: #fef5ec;
}
#freview .subtitle_r{
	color: #777641;
	font-weight: bold;
}
#freview .subtitle_r span{
	position: relative;
}
#freview .subtitle_r span::after{
	content: "";
	border-top: dashed 2px #afa288;
	background-size: 100%;
	width: 60%;
	left: 0;
	right: 0;
	margin: auto;
	position: absolute;
}
#freview .reviewtitle{
	margin-bottom: 20px;
}
#freview .reviewnote2{
	margin-top: 5px;
}
#freview .reviewflow section::before{
	font-family: "Font Awesome 5 Free"; 
	font-weight: 900; 
	content: "\f0d7";
	left: 0;
	right: 0;
	margin: auto;
	line-height: 0.4em;
	position: absolute;
	color: #de965b;
	text-align: center;
}
#freview .stepnum{
	font-family: 'Nothing You Could Do', cursive;
	color: #de965b;
	font-weight: bold;
}
#freview .steptxt{
	font-weight: bold;
}
#freview .reviewflow picture img{
	display: block;
}
#freview .reviewtxt{
	color: #de965b;
	font-weight: bold;	
}
#freview .reviewnote li{
	position: relative;
}
#freview .reviewnote li::before{
	position: relative;
	content: "※";
}
#freview .readmore_r{
	background: #de965b;
	text-align: center;
}
#freview .readmore_r a{
	display: block;
	color: #fff;
	font-weight: bold;
}
#freview .readmore_r2{
	text-align: center;
	color: #888768;
}
#freview .readmore_r2 a{
	border-bottom: solid 1px #888768;
}
#freview .sotsuhana{
	background: url(https://www.farbeco.jp/s/images/review/bacheart.jpg);
}
#freview .tokutencontainer{
	background: #f1eee9;
	position: relative;
}
#freview .tokutencontainer::before{
	content: "";
	background: url(https://www.farbeco.jp/s/images/review/ticket.png) no-repeat;
	background-size: 100%;
	height: 100px;
	top: -50px;
	position: absolute;
	z-index: 1;
}
#freview .tokutencontainer p span{
	font-weight: bold;
	color: #de965b;
}
#freview h2 span, #freview .reviewtitle, #freview .voicearea h3 span{
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
@media (min-width: 1400px) and (max-width:1600px){
  #freview .reviewtop{background-size: 105%;}
  }
  
  @media screen and (min-width:2000px){
  #freview .reviewtop{background-size: 80%;}
  }
  @media screen and (min-width:1100px){
  #freview .voicelist li{padding: 45px 0 35px;font-size: 20px;}
  #freview .reviewflow .reviewarea{width: 70%;}
  }
  @media screen and (min-width:1300px){
  #freview .stepnum,#freview .steptxt,#freview .reviewnote2{text-align: center;}
  #freview .reviewflow h3{margin-bottom: 40px;}
  #freview .reviewtxt{font-size: 40px;}
  #freview .steptxt{font-size: 22px;}
  #freview .stepnum{font-size: 42px;}
  #freview h2 span, #freview .reviewflow h3,#freview .voicearea h3{font-size: 40px;}
  #freview .reviewflow .subtitle_r{font-size: 36px;}
  #freview h2 span::before{border-top: 45px solid transparent;border-bottom: 45px solid transparent;}
  #freview .catch1 span{font-size: 30px;}
  #freview .catch1{width: 800px;}
  #freview .reviewflex1 .flex1{font-size: 18px;}
  }
  
  @media screen and (min-width:768px) and (max-width:1100px){
  #freview h2 span{font-size: 30px;margin-top: 10px;}
  #freview h2 span::before{
    border-top: 37px solid transparent;
    border-bottom: 37px solid transparent;
  }
  #freview h2 span::after{
    border-top: 32px solid transparent;
    border-bottom: 37px solid transparent;
  }
  #freview .reviewtop{background-size: 130%;}
  }
  
  @media screen and (min-width:768px) and (max-width:1000px){
  #freview .voicelist li{width: 45%;margin-top: 50px;}
  #freview .reviewflow .reviewarea{width: 77%;}
  #freview .reviewpoint{font-size: 22px;}
  #freview .stepnum{font-size: 33px;}
  #freview .reviewtxt{font-size: 32px;}
  #freview .tokutencontainer p{font-size: 18px;width: 530px;}
  #freview .tokutencontainer{width: 98%;outline-offset: -13px;}
  #freview .tokutencontainer::before{width: 150px;top: -55px;}
  }
  @media screen and (min-width:768px) and (max-width:900px){
  #freview .catch1{width: 650px;}
  #freview .text1{font-size: 16px;}
  #freview .catch1 span{font-size: 20px}
  #freview .catch1::after{top: -110px;left: 10px;width: 320px;}
  #freview h2 span{font-size: 25px;margin-top: 10px;}
  #freview h2 span::before{
    border-top: 32px solid transparent;
    border-bottom: 32px solid transparent;
  }
  #freview h2 span::after{
    border-top: 32px solid transparent;
    border-bottom: 32px solid transparent;
  }
  #freview .voicearea h3{font-size: 26px;}
  #freview .voicearea h3 i{font-size: 35px;}
  #freview .voicearea h3::before{top: 20px;}
  #freview .reviewpoint{width: 100%;}
  }
@media screen and (min-width: 768px){
  #freview .reviewtop{
    background: url(https://www.farbeco.jp/s/images/review/reviewtobbac.png) no-repeat, #fef5ec;
    padding: 180px 0 60px;
    background-position: center center;
    background-size: 120%;
  }
  #freview .reviewarea{
    max-width: 1200px;
    width: 80%;
  }
  #freview .catch1{
    width: 740px;
    margin: 0 auto;
  }
  #freview .catch1::before{
    content: "";
    background: url(https://www.farbeco.jp/s/images/review/reviewtop.png) no-repeat;
    background-size: 100%;
    width: 300px;
    height: 250px;
    bottom: -10px;
    right: 0;
    position: absolute;
  }
  #freview .catch1::after{
    background: url(https://www.farbeco.jp/s/images/review/star.png) no-repeat;
    content: "";
    background-size: 100%;
    width: 350px;
    height: 200px;
    top: -120px;
    left: 10px;
    position: absolute;
  }
  #freview .catch1 span{
    font-weight: bold;
    display: inline-block;
    position: relative;
  }
  #freview .catch1 span::before{
    bottom: 0;
  }
  #freview h2, #freview h3{
    letter-spacing: 3px;
  }
  #freview h2 span{
    font-size: 33px;
    padding: 12px 60px 10px;
    margin: 20px 0 30px;
  }
  #freview h2 span::before{
    border-top: 39px solid transparent;
    border-bottom: 39px solid transparent;
    border-left: 15px solid #fef5ec;
    left: 0;
  }
  #freview h2 span::after{
    border-top: 39px solid transparent;
    border-bottom: 39px solid transparent;
    border-right: 15px solid #fef5ec;
    right: 0;
  }
  #freview .voicearea{
    margin: 80px auto;
  }
  #freview .voicearea h3{
    font-size: 32px;
  }
  #freview .voicearea h3::before{
    top: 26px;
  }
  #freview .voicearea h3 span{
    padding: 0 30px;
  }
  #freview .voicearea h3 i{
    font-size: 45px;
  }
  #freview .voicelist{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  #freview .voicelist li{
    width: 38%;
    margin: 60px 6% 0 0;
    border: 8px solid #daf0f0;
    padding: 45px 0 35px;
    font-size: 18px;
    line-height: 2em;
  }
  #freview .voicelist li::before{
    width: 60%;
    top: -14%;
  }
  #freview .voicelist li:nth-child(2)::before, #freview .voicelist li:nth-child(3)::before{
    background: url(https://www.farbeco.jp/s/images/review/crip.svg) no-repeat;
    width: 20%;
    top: -20%;
  }
  #freview .voicelist li:nth-child(2n){
    margin-right: 0;
  }
  #freview .voicelist li:nth-child(2), #freview .voicelist li:nth-child(3){
    background: #daf0f0;
  }
  #freview .reviewflex1{
    display: flex;
    align-items: center;
    margin-top: 60px;
  }
  #freview .reviewflex1 .staffimg2{
    width: 17%;
    margin-left: 80px;
  }
  #freview .reviewflex1 .staffimg2::before{
    left: -60px;
    top: 10%;
    transform: rotateZ(25deg);
  }
  #freview .reviewflex1 .flex1{
    margin-left: 20px;
    font-size: 17px;
    line-height: 1.9em;
  }
  #freview .reviewpoint{
    padding: 30px 0 25px;
    text-align: center;
    font-size: 25px;
    font-family: 'Noto Sans JP', sans-serif;
    margin: 40px auto 0;
    width: 96%;
    letter-spacing: 3px;
    outline: dotted 3px #fff;
    outline-offset: -10px;
  }
  #freview .reviewpoint .span1{
    font-size: 35px;
    font-weight: bold;
  }
  #freview .reviewpoint .span2{
    font-size: 17px;
    display: block;
    width: 540px;
    margin: 7px auto 0;
    text-align: left;
  }
  #freview .reviewflow{
    padding: 60px 0 80px;
  }
  #freview .reviewflow .reviewarea{
    width: 65%;
  }
  #freview .subtitle_r{
    font-size: 30px;
    margin-bottom: 15px;
  }
  #freview .reviewflow .subtitle_r{
    font-size: 35px;
  }
  #freview .subtitle_r span::after{
    bottom: -15px;
  }
  #freview .reviewtitle{
    font-size: 35px;
  }
  #freview .reviewnote2{
    font-size: 15px;
  }
  #freview .reviewflow section{
    margin-bottom: 100px;
  }
  #freview .reviewflow section::before{
    font-size:80px;
    bottom: -55px;
  }
  #freview .stepnum{
    font-size: 38px;
    transform: rotateZ(-2deg);
  }
  #freview .steptxt{
    font-size: 18px;
    margin-top: 19px;
  }
  #freview .reviewflow picture img{
    margin-top: 15px;
    border: solid 5px #de965b;
  }
  #freview .reviewimg{
    width: 300px;
    margin: 120px auto 0;
  }
  #freview .reviewtxt{
    font-size: 35px;
  }
  #freview .reviewnote{
    width: 500px;
    margin: 10px auto;
    font-size: 17px;
  }
  #freview .readmore_r{
    margin: 50px auto 0;
    width: 400px;
  }
  #freview .readmore_r a{
    padding:  14px 0 13px;
    font-size: 20px;
  }
  #freview .readmore_r:hover{
    opacity: .8;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all  0.5s ease;
    cursor: pointer!important;
  }
  #freview .readmore_r2{
    margin-top: 40px;
  }
  #freview .sotsuhana{
    padding: 80px 0px;
    background-size: 100%;
  }
  #freview .sotsuhanatxt1{
    text-align: center;
    margin: 30px 0 40px;
    font-size: 18px;
    line-height: 1.9em;
  }
  #freview .sotsuhanaimgflex{
    display: flex;
    align-items: flex-start;
  }
  #freview .sotsuhanaimgflex>p{
    width: 42.3%;
  }
  #freview .sotsuhanaimgflex p{
    margin: 10px;
    box-shadow: 1px 1px 6px #a59d98;
  }
  #freview .sotsuhanaimgflex2>p{
    order: 2;
  }
  #freview .sotsuhanaimgflex2 div{
    order: 1;
  }
  #freview .sotsuhanaimgflex2 div p{
    flex-shrink: 1;
  }
  #freview .tokutencontainer{
    padding: 45px 0 40px;
    width: 90%;
    max-width: 900px;
    margin: 90px auto 0;
    outline: dashed 3px #fff;
    outline-offset: -15px;
  }
  #freview .tokutencontainer::before{
    width: 160px;
    right: 40px;
  }
  #freview .tokutencontainer p{
    font-size: 20px;
    line-height: 1.8em;
    width: 587px;
    margin: 0 auto;
  }
  #freview .tokutencontainer p span{
    font-size: 23px;
  }
}
@media screen and (max-width: 767px){
  #freview .reviewtop{
    background: #fef5ec;
    padding: 100px 0 40px;
    overflow: hidden;
  }
  #freview .catch1{
    z-index: 20;
  }
  #freview .reviewtop::before{
    content: "";
    background: url(https://www.farbeco.jp/s/images/review/reviewtop.png) no-repeat;
    background-size: 100%;
    width: 40%;
    height: 250px;
    top: 10px;
    right: 5px;
    position: absolute;
    z-index: 10;
  }
  #freview .reviewtop::after{
    background: url(https://www.farbeco.jp/s/images/review/star.png) no-repeat;
    content: "";
    background-size: 100%;
    width: 50%;
    height: 200px;
    top: 30px;
    transform: rotateZ(-10deg);
    left: 35px;
    position: absolute;
    z-index: 1;
  }
  #freview .catch1 span{
    font-weight: bold;
    display: inline-block;
    position: relative;
  }
  #freview .catch1 span::before{
    bottom: -15px;
    z-index: 15;
  }
  #freview h2, #freview h3{
    letter-spacing: 2px;
  }
  #freview h2 span{
    font-size: 19px;
    padding: 7px 45px;
    margin: 0 0 25px;
    line-height: 1.4em;
    z-index: 30;
  }
  #freview h2 span::before{
    border-top: 33px solid transparent;
    border-bottom: 33px solid transparent;
    border-left: 13px solid #fef5ec;
    left: -1px;
  }
  #freview h2 span::after{
    border-top: 33px solid transparent;
    border-bottom: 33px solid transparent;
    border-right: 13px solid #fef5ec;
    right: -1px;
  }
  #freview .text1{
    line-height: 1.8em;
  }
  #freview .voicearea{
    margin: 40px auto;
    overflow: hidden;
  }
  #freview .voicearea h3{
    font-size: 20px;
    white-space: nowrap;
    line-height: 1.5em;
  }
  #freview .voicearea h3::before{
    top: 14px;
  }
  #freview .voicearea h3 span{
    padding: 0 15px;
  }
  #freview .voicearea h3 i{
    font-size: 25px;
  }
  #freview .voicelist{
    width: 80%;
    margin: 0 auto;
  }
  #freview .voicelist li{
    margin-top: 30px;
    border: 5px solid #daf0f0;
    padding: 35px 0 25px;
    font-size: 15px;
    line-height: 1.9em;
  }
  #freview .voicelist li::before{
    width: 50%;
    top: -12%;
    max-width: 200px;
  }
  #freview .voicelist li:nth-child(2n)::before{
    background: url(https://www.farbeco.jp/s/images/review/crip.svg) no-repeat;
    width: 17%;
    top: -16%;
    max-width: 70px;
  }
  #freview .voicelist li:nth-child(2n){
    background: #daf0f0;
  }
  .reviewflex1{
    margin-top: 40px;
  }
  #freview .reviewflex1 .staffimg2{
    width: 30%;
    margin: 10px auto 0 auto;
  }
  #freview .reviewflex1 .staffimg2::before{
    right: -65%;
    top: 15px;
    transform: rotateZ(-50deg);
  }
  #freview .reviewflex1 .staffimg2::after{
    left: -75%;
    top: 15px;
    transform: rotateZ(50deg);
  }
  #freview .reviewpoint{
    background: #84d2d7;
    color: #fff;
  }
  #freview .reviewpoint .span1{
    font-size: 25px;
    margin: 3px 0;
    text-align: center;
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 2px;
  }
  #freview .reviewpoint .span2{
    font-size: 14px;
  }
  #freview .reviewflow{
    padding: 35px 0 40px;
    overflow: hidden;
  }
  #freview .subtitle_r{
    font-size: 18px;
    margin-bottom: 13px;
  }
  #freview .subtitle_r span::after{
    bottom: -10px;
  }
  #freview .reviewtitle{
    font-size: 23px;
    line-height: 1.3em;
  }
  #freview .reviewflow section{
    margin-bottom: 50px;
  }
  #freview .reviewflow section::before{
    font-size:40px;
    bottom: -32px;
  }
  #freview .stepnum{
    font-size: 25px;
    text-align: center;
  }
  #freview .steptxt{
    text-align: center;
    white-space: nowrap;
  }
  #freview .reviewflow picture img{
    margin-top: 10px;
    border: solid 3px #de965b;
  }
  #freview .reviewimg{
    width: 55%;
    margin: 60px auto 0;
  }
  #freview .reviewtxt{
    font-size: 20px;
    line-height: 1em;
    font-family: 'Noto Sans JP', sans-serif;
  }
  #freview .reviewnote{
    margin: 20px auto 0;
  }
  #freview .readmore_r{
    margin: 30px auto 0;
    width: 90%;
  }
  #freview .readmore_r a{
    padding:  13px 0 12px;
    font-size: 15px;
  }
  #freview .readmore_r2{
    margin-top: 20px;
  }
  #freview .sotsuhana{
    padding: 40px 0px;
    background-size: 250%;
  }
  #freview .sotsuhanatxt1{
    margin: 20px 0;
  }
  #freview .sotsuhanaimgflex p{
    margin: 8px;
    box-shadow: 1px 1px 5px #a59d98;
  }
  #freview .tokutencontainer{
    padding: 25px 20px;
    margin: 50px auto 0;
    outline: dashed 2px #fff;
    outline-offset: -7px;
    line-height: 1.8em;
  }
  #freview .tokutencontainer::before{
    width: 120px;
    right: 15px;
  }
  #freview .tokutencontainer p span{
    font-size: 15px;
  }
}
@media screen and (min-width:600px) and (max-width:767px){
	#freview .reviewimg{width: 40%;margin-bottom: 10px;}
	#freview .reviewtop::after{width: 40%;}
	#freview .reviewtop::after{left: 100px;}
	#freview .catch1{left: 15%;}
	#freview .voicelist{width: 60%;}
	#freview .voicelist li{padding: 40px 0;}
	#freview .reviewpoint{text-align: center;}
	#freview .reviewflow picture img{max-width: 400px;margin: 10px auto 0;}
	#freview .reviewnote2{text-align: center;}
	#freview .reviewnote{text-align: center;}
	#freview .tokutencontainer{font-size: 16px;}
	#freview .tokutencontainer p span{font-size: 18px;}
	#freview .readmore_r{max-width: 400px;}
}
@media screen and (max-width:400px){
#freview h2 span{padding: 7px 35px;}
}

/*お年玉キャンペーン*/
#otoshidama .inner{
	position: relative;
	z-index: 50;
	box-shadow: 4px 4px 12px #967e53;
}
.otoshidama img{
	width: 100%;
}
.otoshidamabac1, .otoshidamabac2{
	position: relative;
}
.otoshidamabac1::before{
	content: "";
	background: url(https://www.farbeco.jp/s/images/otoshidama/decor.svg);
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 10;
	top: 0;
	left: 0;
	opacity: .2;
}
.otoshidamabac2::before{
	background-size: 5.8%;
}
.otoshidamabac1{
	background: #c8ad7d;
}
.otoshidamabac2{
	background: #c92c1a;
}

.campaignbac{
	background: #faf7f2;
}
.otoshidama h3{
	text-align: center;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.o_num1{
	vertical-align: middle;
	display: inline-block;
}
.o_num2{
	position: relative;
	line-height: 1em;
}
.o_num2::before{
	content: "";
	background: url(https://www.farbeco.jp/s/images/otoshidama/ume.png) no-repeat;
	background-size: 100%;
	position: absolute;
}
.camcatch{
	text-align: center;
	font-size: 25px;
	font-weight: bold;
}
.gstlong{
	color: #cca765;
	text-align: center;
  font-family: source-han-serif-japanese, serif;
  font-weight: 900;
  font-style: normal;
}
.couponcode{
	background: url(https://www.farbeco.jp/s/images/otoshidama/paper.jpg);
	background-size: cover;
	text-align: center;
	color: #fff;
	outline: dotted 1px rgba(255, 255, 255, 0.8);
}
.couponcode span{
	display: block;
}
.o_piriod{
	background: #fff;
	text-align: center;
	position: relative;
}
.o_piriod dt{
	font-weight: bold;
  background: #cca765;
  color: #fff;
}
.o_piriod dd p:first-child{
	font-family: source-han-serif-japanese, serif;
  font-weight: 900;
}
.o_piriod dd p:last-child{
	font-weight: bold;
}
.o_conditions{
	text-align: center;
	font-weight: bold;
	color: #cca765;
	position: relative;
	z-index: 10;
}
.o_conditions::before{
	position: absolute;
	content: "";
	background: #000;
	width: 100%;
	height: 1px;
	margin: auto;
	left: 0;
	z-index: -1;
}
.o_conditions span{
	background: #faf7f2;
}
.o_list{
	font-weight: bold;
	position: relative;
}
.o_campaign1 .o_list::before{
	content: "";
	background: url(https://www.farbeco.jp/s/images/otoshidama/cow.png) no-repeat;
	background-size: 100%;
	position: absolute;
}
.o_list li{
	list-style: disc;
}
.face_simg img{
	border-radius: 10px 10px 0 0;
}
.face_simg2 img{
	border-radius: 50%;
}
.face_simg flexlist{
	align-items: flex-start;
}
.o_target{
	font-weight: bold;
	flex: 1;
	color: #fff;
	font-family: source-han-sans-japanese, sans-serif;
	font-weight: 700;
}
.o_target span{
	background: #ff8d96;
	line-height: 1.4em;
}
.presentimg{
	background: #c9b482;
	border-radius: 10px;
}
.targetlist_o{
	display: flex;
	justify-content: space-between;
}
.o_shipping{
	text-align: center;
	font-weight: bold;
}
.o_shipping i, .s_checknow i{
	color: #ff8d96;
}
.gstlong span{
	color: #e60001;
}
.o_campaign3 ul{
	display: flex;
	justify-content: space-between;
}
.o_campaign3 li{
	width: 31%;
	border: solid 1px #c9b482;
}
.s_checknow{
    text-align: center;
    font-weight: bold;
}
.salepagelink{
	text-align: center;
  background: url(https://www.farbeco.jp/s/images/otoshidama/paper.jpg);
  background-size: cover;
}
.salepagelink a{
	display: block;
	color: #fff;
	font-weight: bold;
}
.o_lastmessage1{
	position: relative;
	max-height: 400px;
}
.o_lastmessage1 img{
	object-fit: cover;
}
.o_lastmessage2{
	position: absolute;
	left: 50%;
	z-index: 10;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	text-align: center;
	color: #efdfc3;
	line-height: 1.8em;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-weight: bold;
}
.o_toplink{
	background: #121212;
}
.o_toplink p{
	text-align: center;
	margin: 0 auto;
	border: solid 1px #efdfc3;
}
.o_toplink p a{
	color: #efdfc3;
	display: block;
}
@media screen and (min-width:768px) and (max-width:1150px){
	.o_target{font-size: 22px;}
}
@media screen and (min-width:768px) and (max-width:1000px){
	#otoshidama .inner{width: 90%;}	
	.face_simg2{width: 230px;margin-top: -100px;}
	.gstlong{font-size: 46px;}
	.o_lastmessage2{font-size: 40px;}
}
@media screen and (min-width: 768px){
  #otoshidama .inner{
    width: 80%;
    padding: 65px 5% 80px;
    border-radius: 30px;
  }
  .otoshidama h2{
    background: url(https://www.farbeco.jp/s/images/otoshidama/maintopbac.jpg) no-repeat;
    background-size: 100%;
    background-position: center center;
    overflow: hidden;
  }
  .otoshidama h2 img{
    max-width: 1000px;
    margin: 0 auto;
    display: block;
    width: 80%;
  }
  .otoshidamabac1, .otoshidamabac2{
    padding: 85px 0;
  }
  .otoshidamabac1::before{
    background-size: 5.8%;
  }
  .otoshidamabac2::before{
    background-size: 5.8%;
  }
  .otoshidama h3{
    font-size: 53px;
    margin-bottom: 25px;
  }
  .o_num1{
    font-size:50px;
    margin: -28px 5px 0 40px;
  }
  .o_num2{
    font-size: 85px;
  }
  .o_num2::before{
    width: 155px;
    height: 150px;
    top: -30px;
    right: -43px;
  }
  .camcatch{
    color: #bd0104;
  }
  .gstlong{
    font-size: 52px;
    line-height: 1.4em;
  }
  .couponcode{
    padding: 20px 0;
    width: 400px;
    margin: 40px auto 50px;
    font-size: 25px;
    font-weight: bold;	
    line-height: 1.6em;
    outline-offset: -6px;	
  }
  .couponcode span{
    letter-spacing: 4px;
    font-size: 35px;
  }
  .o_piriod{
    border: solid 10px #c9b482;
    padding: 40px 20px;
  }
  .o_piriod dt{
    font-size: 30px;
    margin: 0 20px 20px;
    padding-top: 2px;
  }
  .o_piriod dd{
    font-size: 20px;
  }
  .o_piriod dd p:first-child{
    display: block;
    background: linear-gradient(transparent 60%, #fff99e 60%);
    width: 600px;
    margin: 0 auto 10px;
  }
  .o_piriod dd p:first-child .s_strong{
    font-size: 35px;
    margin-left: 5px;
  }
  .o_piriod dd p:last-child{
    font-size: 30px;
  }
  .o_conditions{
    font-size: 30px;
    margin-top: 50px;
  }
  .o_conditions::before{
    bottom: 25px;
  }
  .o_conditions span{
    padding: 0 20px;
  }
  .o_list{
    font-size: 25px;
    width: 600px;
    margin: 20px auto 0;  
  }
  .o_campaign1 .o_list::before{
    width: 155px;
    height: 122px;
    bottom: 0;
    right: -43px;
  }
  .o_list li{
    margin-left: 30px;
    margin-top: 2px;
  }
  .face_simg{
    margin: 30px auto 30px;
  }
  .face_simg2{
    width: 250px;
    margin: -120px 20px 5px 20px;
  }
  .face_simg2 img{
    border: solid 15px #c9b482;
  }
  .o_target{
    font-size: 27px;
    margin-bottom: 20px;
  }
  .o_target span{
    padding: 0 7px 4px 10px;
    display: inline-block;
    margin-right: 5px;
  }
  .targetlist_o li{
    width: 23%;
  }
  .o_shipping{
    font-size: 27px;
    margin: 50px 0 10px;
  }
  .gstlong span{
    margin-right: 10px;
  }
  .s_checknow{
    font-size: 27px;
    margin: 50px 0 10px;
  }
  .salepagelink{
    width: 430px;
    margin: 60px auto 0;
  }
  .salepagelink:hover{
    opacity: .8;
  }
  .salepagelink a{
    font-size: 30px;
    padding: 20px 0;
    border: solid 5px #c9b482;
    letter-spacing: 3px;
  }
  .o_lastmessage1 img{
    max-height: 400px;
  }
  .o_lastmessage2{
    top: 50%;
    font-size: 43px;
    letter-spacing: 2px;
    white-space: nowrap;
  }
  .o_toplink{
    padding: 50px 0;
  }
  .o_toplink p{
    width: 400px;
    background: #000;
  }
  .o_toplink p:hover{
    background: rgba(240, 224, 196, 0.3);
  }
  .o_toplink p a{
    font-size: 20px;
    padding: 10px 0;
  }
}
@media screen and (max-width: 767px){
  /*お年玉キャンペーン*/
  #otoshidama .inner{
	  padding: 30px 15px 36px;
	  border-radius: 8px;
  }
  .otoshidamabac1, .otoshidamabac2{
    padding: 30px 0;
  }
  .otoshidamabac1::before{
    background-size: 19px;
  }
  .otoshidamabac2::before{
    background-size: 19px;
  }
  .otoshidama h3{
    font-size: 25px;
    margin-bottom: 20px;
  }
  .o_num1{
    font-size:22px;
    margin: -14px 5px 0 15px;
  }
  .o_num2{
    font-size: 37px;
  }
  .o_num2::before{
    width: 80px;
    height: 77px;
    top: -20px;
    right: -25px;
  }
  .camcatch{
    color: #e60100;
    font-size: 14px;
  }
  .gstlong{
    font-size: 21px;
    line-height: 1.5em;
    white-space: nowrap;
  }
  .couponcode{
    padding: 13px 0;
    width: 67%;
    margin: 17px auto 30px;
    font-weight: bold;
    outline-offset: -4px;
    font-size: 15px;	
  }
  .couponcode span{
    letter-spacing: 1px;
    font-size: 20px;
    line-height: 1.4em;
  }
  .o_piriod{
    border: solid 3px #c9b482;
    padding: 15px 15px 10px;
  }
  .o_piriod dt{
    font-size: 16px;
    margin-bottom: 8px;
    padding: 3px 0 2px;
  }
  .o_piriod dd p:first-child{
    display: inline;
    background: linear-gradient(transparent 40%, #fff99e 40%);
    position: relative;
    font-size: 15px;
  }
  .o_spab{
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: 23px;
  }
  .s_strong{
    font-size: 22px;
    margin-left: 5px;
  }
  .s_strong1{
    margin-bottom: 15px;
    display: inline-block;
  }
  .o_piriod dd p:last-child{
    font-size: 17px;
    margin-top: 5px;
  }
  .o_conditions{
    font-size: 19px;
    margin-top: 30px;
  }
  .o_conditions::before{
    bottom: 16px;
  }
  .o_conditions span{
    padding: 0 13px;
  }
  .o_list{
    font-size: 15px;
    margin: 8px auto 0;  
  }
  .o_campaign1 .o_list::before{
    width: 65px;
    height: 53px;
    bottom: -25px;
    right: -5px;
  }
  .o_list li{
    margin-left: 22px;
    margin-top: 3px;
  }
  .face_simg{
    margin: 13px auto 9px;
  }
  .face_simg2{
    width: 100px;
  }
  .face_simg2 img{
    border: solid 5px #c9b482;
    margin:-25px 10px 0 0;
  }
  .o_target{
    font-size: 13px;
    margin:0 5px 12px 0;
  }
  .o_target span{
    padding: 0 5px;
    margin:0 5px;
  }
  .targetlist_o{
    flex-wrap: wrap;
    width: 90%;
    margin: -3px auto 0;
  }
  .targetlist_o li{
    width: 48%;
    margin-top: 4%;
  }
  .o_shipping{
    font-size: 16px;
    margin: 33px 0 2px;
  }
  .gstlong span{
    margin-right: 5px;
  }
  .s_checknow{
    font-size: 16px;
    white-space: nowrap;
    line-height: 1.4em;
    margin: 27px 0 10px;
  }
  .salepagelink{
    margin: 35px auto 0;
    width: 80%;
  }
  .salepagelink a{
    font-size: 17px;
    padding: 12px 0 11px;
    border: solid 4px #c9b482;
    letter-spacing: 2px;
  }
  .o_lastmessage2{
    top: 52%;
    font-size: 19px;
    white-space: nowrap;
  }
  .o_toplink{
    padding: 27px 0 30px;
  }
  .o_toplink p{
    width: 60%;
  }
  .o_toplink p a{
    padding: 8px 0 7px;
  }
}
@media screen and (max-width:350px){
	.o_lastmessage2{font-size: 17px;}
}

/*お年玉キャンペーンここまで*/

/*絆深まる卒業記念品css*/
.graduation,.graduation a, .graduation h2, .graduation h3, .graduation h4{
	color: #464646;
	font-weight: bold
}
.graduation h2, .graduation h3, .graduation h4, .g_lastmessage p:first-child{
	letter-spacing: 2px;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.weddingphoto h3, .g_lineup h4, .rapid_option h3 span, .g_gift h3, .g_point h3{
  font-family: "游ゴシック体"," 游ゴシック", "Yu Gothic", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
}
.g_lineup h4 span, .g_gift h3 span, .g_point span{
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.g_mainarea0{
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}
.g_mainarea{
	margin-left: auto;
	margin-right: auto;
}
.g_mainimg{
	position: relative;
}
.g_mainimg p img{
	object-fit:cover;
	object-position: center 30%;
}
.g_mainimg h2{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
}
.g_toptxt{
	line-height: 2.1em;
}
.g_gift{
	background-size: 170px;
	background: #fff4f4;
	position: relative;
}
.g_gift::before{
	content: "";
	position: absolute;
	background: url(https://www.farbeco.jp/s/images/graduation/sakura.png) no-repeat;
	height: 100%;
	background-size: 100%;
	top: 0;
	opacity: .7;
}
.g_gift .g_mainarea{
	position: relative;
	z-index: 10;
}
.g_gift h3{
	text-align: center;
	color: #716850;
}
.g_gift h3 span{
	display: block;
	font-weight: bold;
	position: relative;
}
.g_gift h3 span::before{
	content: "";
	position: absolute;
	background: url(https://www.farbeco.jp/s/images/graduation/line1.svg) no-repeat;
	left: 0;
	text-align: center;
	left: 50%;
  transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
}
.g_gift h3 span::after{
	content: "";
	position: absolute;
	background: url(https://www.farbeco.jp/s/images/graduation/line2.svg) no-repeat;
	text-align: center;
	left: 50%;
  transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
}
.g_ex{
	text-align: center;
	border-radius: 5px;
	position: relative;
}
.g_ex span{
	line-height: 1.4em;
	letter-spacing: 3px;
}
.g_giftscene li div{
	position: relative;
}
.g_giftscene li h4{
	position: absolute;
	top: 50%;
	left: 50%;
	white-space: nowrap;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
	color: #fff;
	text-shadow: 1px 1px 7px #a09582;
}
.g_to{
	text-align: center;
}
.g_to span{
	position: relative;
}
.g_to span::before{
	content: "";
	position: absolute;
	z-index: 1;
	transform: rotate(58deg);
}
.g_to span::after{
	content: "";
	position: absolute;
	height: 2px;
	z-index: 1;
	transform: rotate(-58deg);
}
.g_point h3 span{
	background:linear-gradient(transparent 70%, #ffdcdc 70%);
}
.g_point li p:last-child{
	white-space: nowrap;
}
.g_point li p:last-child span{
	color: #e29700;
	font-weight: bold;
}
.weddingphoto{
	background: #ffe7d5;
	position: relative;
}
.weddingphoto .g_mainarea{
	position: relative;
	z-index: 10;
}
.weddingphoto h3{
	text-shadow: 0px 0px 5px #fff;
}
.weddingphoto h3 span{
	color: #8a7b51;
	font-weight: bold;
}
.weddingphoto ul{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.weddingphoto .g_mainarea li img{
	border-radius: 3px;
}
.weddingphoto .g_mainarea li img{
	border-radius: 3px;
}
.g_lineup{
	background-size: 170px;
}
.g_lineup h3{
	text-align: center;
	position: relative;
  color: #716850;
}
.g_lineup h3 span{
	position: relative;
	z-index: 10;
	background: url(https://www.farbeco.jp/s/images/graduation/paper2.jpg) repeat;
	background-size: 170px;
}
.g_lineup h3::before{
	position: absolute;
	content: "";
	background: url(https://www.farbeco.jp/s/images/graduation/line3.svg);
	background-repeat: repeat-x;
	height: 10px;
	background-size: 300px;
	width: 100%;
	left: 0;
}
.g_lineup ul li:nth-child(n+2){
	margin-top: 60px;
}
.g_lineup ul li div{
	text-align: center;
}
.g_lineup h4 span{
	display: block;
	letter-spacing: 2px;
}
.g_morelink a{
	display: block;
	color: #fff;
	background: #a99b74;
}
.g_line{
	text-align: center;
}
.g_morelink2{
	text-align: center;	
}
.g_morelink2 a{
	display: block;
}
.g_morelink2 a::before{
  content: "";
  position: absolute;
  background: url(https://www.farbeco.jp/s/images/graduation/sakuradecor.png) no-repeat;
  background-size: 100%;
  top: -17px;
  left: -24px;
  filter: drop-shadow(2px 2px 4px rgb(169 155 116 / 20%));
}
.g_morelink2 a::after{
  content: "";
  position: absolute;
  background: url(https://www.farbeco.jp/s/images/graduation/sakuradecor2.png) no-repeat;
  background-size: 100%;
  filter: drop-shadow(2px 2px 4px rgb(169 155 116 / 20%));
}
.rapid_option h3{
	text-align: center;
	white-space: nowrap;
}
.rapid_option h3 span{
	display: block;
}
.g_morelink3{
	width:90%;
	margin: 35px auto 0;	
	min-width: 300px;
}
.g_morelink3 a{
	display: block;
	background: #fff;
	border: solid 3px #a99b74;
	color: #a99b74;
}
.g_custmize{
	background: url(https://www.farbeco.jp/s/images/graduation/paper.jpg) repeat;
	background-size: 50px;
}
.g_custmize h3{
	background: #ef7591;
	color: #fff;
}
.custmizetxt{
	line-height: 2em;
}
.custmizetxt span{
	background: linear-gradient(transparent 70%, #ffdcdc 70%);
}
.g_morelink4{
	margin: 0 auto;
	text-align: center;
}
.g_morelink4 a{
	display: block;
	background: #ffeb9d;
}
.g_last{
	text-align: center;
}
.g_lastmessage{
	background: url(https://www.farbeco.jp/s/images/graduation/bac_lastmessage.jpg) no-repeat;
	background-size: cover;
	background-position: center top;
}
.g_lastmessage p:first-child{
	text-shadow: 3px 3px 3px #fff;
}
.g_morelink5{
	margin-top: 25px;
}


@media screen and (min-width: 768px){
  .graduation,.graduation a, .graduation h2, .graduation h3, .graduation h4{
    letter-spacing: 2px;
  }
  .graduation h2, .graduation h3, .graduation h4, .g_lastmessage p:first-child{
    line-height: 1.7em;
  }
  .g_mainarea0{
    max-width: 1400px;
  }
  .g_mainarea{
    max-width: 1200px;
    width: 80%;
  }
  .gbottom{
    margin-bottom: 80px;
  }
  .g_mainimg{
    margin: 30px 0 50px;
  }
  .g_mainimg p img{
    max-height: 550px;
  }
  .g_mainimg h2{
    width: 80%;
    max-width: 950px;
  }
  .g_toptxt{
    font-size: 20px;
    text-align: center;
    margin-bottom: 50px;
  }
  .g_gift{
    padding: 80px 0;
  }
  .g_gift::before{
    width: 100%;
    max-width: 1200px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
  }
  .g_gift h3{
    font-size: 20px;
  }
  .g_gift h3 span{
    font-size: 33px;
    line-height: 1.5em;
    margin-top: 53px;
    letter-spacing: 4px;
  }
  .g_gift h3 span::before{
    width: 400px;
    height: 15px;
    top: -35px;
  }
  .g_gift h3 span::after{
    width: 400px;
    height: 15px;
    bottom: -33px;
  }
  .g_ex{
    font-size: 24px;
    margin:90px 0 40px;
    padding: 12px 0 10px;
  }
  .g_ex span{
    background: linear-gradient(transparent 70%, #ffdcdc 70%);
    padding: 0 10px;
    display: inline-block;
  }
  .g_giftscene{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .g_giftscene li{
    width: 47%;
  }
  .g_giftscene li:nth-child(n+3){
    margin-top: 80px;
  }
  .g_giftscene li h4{
    font-size: 48px;
    letter-spacing: 8px;
  }
  .g_to{
    font-size: 25px;
    margin-bottom: 12px;
  }
  .g_to span::before{
    border-top: solid 1px #716850;
    top: 15px;
    left: -35px;
    width: 25px;
  }
  .g_to span::after{
    border-top: solid 1px #716850;
    top: 15px;
    right: -32px;
    width: 25px;
  }
  .g_point{
    text-align: center;
  }
  .g_point h3{
    font-size: 22px;
    margin-bottom: 35px;
  }
  .g_point h3 span{
    display: inline-block;
    font-size: 35px;
    margin-top: 18px;
    padding: 0 10px 2px;
  }
  .g_point ul{
    display: flex;
    justify-content: space-between;
  }
  .g_point li{
    width: 33%;
  }
  .g_point li p:first-child{
    width: 70%;
    margin: 0 auto 25px;
  }
  .g_point li p:last-child{
    font-size: 22px;
    margin-top: -20px;
  }
  .g_point li p:last-child span{
    font-size: 28px;
  }
  .weddingphoto{
    padding: 80px 0 100px;
  }
  .weddingphoto::before{
    content: "";
    position: absolute;
    background: url(https://www.farbeco.jp/s/images/graduation/decor.png) no-repeat;
    width: 100%;
    height: 100%;
    background-size: cover;
    max-width: 2000px;
    top: 0;
    left: 50%;
    white-space: nowrap;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    opacity: .5;
  }
  .weddingphoto h3 span{
    font-size: 32px;
    margin-top: 4px;
    letter-spacing: 4px;
    display: inline-block;
  }
  .weddingphoto li{
    width: 23%;
  }
  .weddingphoto li:nth-child(n+5){
    margin-top: 2.5%;
  }
  .g_lineup{
    padding: 80px 0 100px;
    background: url(https://www.farbeco.jp/s/images/graduation/paper2.jpg) repeat;
  }
  .g_lineup h3{
    font-size: 33px;
    margin-bottom: 70px;
  }
  .g_lineup h3 span{
    padding: 0 40px;
  }
  .g_lineup h3::before{
    top: 24px;
  }
  .g_lineup ul li{
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .g_lineup ul li>p{
    width: 45%;
  }
  .g_lineup ul li div{
    flex: 1;
  }
  .g_lineup h4{
    font-size: 20px;
  }
  .g_lineup h4 span{
    font-size: 30px;
    margin: 15px auto 0;
    padding: 13px 0 12px;
    border-top:  double 4px #a99b74;
    border-bottom:  double 4px #a99b74;
    width: 300px;
  }
  .g_morelink{
    width: 300px;
    margin: 50px auto 0;	
  }
  .g_morelink a{
    padding: 12px 0;
    font-size: 18px;
  }
  .g_line{
    font-size: 25px;
    margin-top: 80px;
  }
  .g_morelink2{
    width: 500px;
    margin: 35px auto 0;
  }
  .g_morelink2 a{
    padding: 20px 0;
    background: #ef7591;
    font-size: 22px;
    color: #fff;
    letter-spacing: 3px;
    position: relative;
  }
  .g_morelink2 a::before{
    width: 55px;
    height: 55px;
  }
  .g_morelink2 a::after{
    width: 70px;
    height: 70px;
    top: 25px;
    right: -30px;
  }
  .g_morelink a:hover, .g_morelink4 a:hover{
    opacity: .7;
  }
  .g_morelink2 a:hover{
    background: #ec92a7;
    color: #fff!important;
  }
  .g_morelink4 a:hover{
    color: #383838;
  }
  .g_movieflex{
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .rapidtxt{
    order: 1;
    flex: 1;
  }
  .g_movie{
    order: 2;
    margin-left: 40px;
  }
  .g_movie iframe{
    width: 450px;
    height:253px;
    margin-left: 30px;
  }
  .rapid_option h3{
    font-size: 28px;
  }
  .rapid_option h3 span{
    font-size: 20px;
  }
  .g_morelink3{
    width:90%;
    margin: 35px auto 0;	
    min-width: 300px;
    text-align: center;
  }
  .g_morelink3 a{
    padding: 12px 0;
    font-size: 18px;
    white-space: nowrap;
  }
  .g_morelink3 a:hover{
    background:  rgba(168, 154, 116, 0.22);
  }
  .g_custmize{
    padding: 80px 0 100px;
    background: url(https://www.farbeco.jp/s/images/graduation/paper.jpg) repeat;
    background-size: 50px;
  }
  .g_custmize{
    padding: 80px 0 100px;
  }
  .g_custmize h3{
    font-size: 30px;
    padding: 7px 0 5px;
  }
  .custmizetxt{
    font-size: 23px;
    text-align: center;
    margin-top: 30px;
  }
  .custmizetxt span{
    font-size: 28px;
    display: inline-block;
    line-height: 1.5em;
  }
  .g_flow{
    width: 90%;
    margin: 65px auto 60px;
  }
  .g_flow img{
    width: 100%;
  }
  .g_morelink4{
    width:500px;
    margin: 35px auto 0;	
  }
  .g_morelink4 a{
    padding: 17px 0;
    font-size: 23px;
  }
  .g_lastmessage{
    padding: 130px 0 110px;
  }
  .g_lastmessage p:first-child{
    font-size: 40px;
    letter-spacing: 4px;
    margin-bottom: 40px;
  }
  .g_morelink5{
    font-size: 18px;
  }
}
@media screen and (max-width: 767px){
  .graduation,.graduation a, .graduation h2, .graduation h3, .graduation h4{
    letter-spacing: 1px;
  }
  .graduation h2, .graduation h3, .graduation h4, .g_lastmessage p:first-child{
    line-height: 2em;
  }
  .g_mainarea{
    width: 90%;
  }
  .gbottom{
    margin-bottom: 55px;
  }
  .g_mainimg{
    margin: 20px 0 40px;
  }
  .g_mainimg p img{
    min-height: 250px;
  }
  .g_mainimg h2{
    width: 100%;
  }
  .g_toptxt.spinner{
    margin-bottom: 40px;
  }
  .g_gift{
    padding: 50px 0 60px;
    overflow: hidden;
  }
  .g_gift::before{
    width: 110%;
    left: 0;
    opacity: .7;
  }
  .g_gift::after{
    content: "";
    position: absolute;
    background: url(https://www.farbeco.jp/s/images/graduation/sakura_sp.png) repeat;
    width: 100%;
    height: 100%;
    background-size: 100%;
    bottom: -50%;
    left: 0;
    opacity: .7;
  }
  .g_gift h3 span{
    font-size: 21px;
    margin-top: 28px;
    white-space: nowrap;
    line-height: 1.7em;
  }
  .g_gift h3 span::before{
    width: 245px;
    height: 8px;
    top: -18px;
  }
  .g_gift h3 span::after{
    width: 245px;
    height: 8px;
    bottom: -18px;
  }
  .g_ex{
    font-size: 18px;
    margin:60px 0 30px;
  }
  .g_ex span{
    background: linear-gradient(transparent 65%, #ffd4d4 65%);
  }
  .g_giftscene{
    width: 90%;
    margin: 0 auto;
  }
  .g_giftscene li:nth-child(n+2){
    margin-top: 55px;
  }
  .g_giftscene li h4{
    font-size: 40px;
    letter-spacing: 7px;
  }
  .g_to{
    font-size: 17px;
    margin-bottom: 13px;
  }
  .g_to span::before{
    border-top: solid 1px #bdb9ad;
    top: 8px;
    left: -32px;
    width: 20px;
  }
  .g_to span::after{
    border-top: solid 1px #bdb9ad;
    top: 8px;
    right: -29px;
    width: 20px;
  }
  .g_point.gbottom{
    text-align: center;
    margin-bottom: 20px;
  }
  .g_point h3{
    margin-bottom: 10px;
  }
  .g_point h3 span{
    font-size: 21px;
  }
  .g_point li{
    display: flex;
    justify-content: center;
    align-items: center;
    border-top: dashed 1px #c6c6c6;
    padding: 5px 0;
  
  }
  .g_point li:first-child{
    border-top: none;
  }
  .g_point li p:first-child{
    width: 130px;
  }
  .g_point li p:last-child{
    font-size: 16px;
    width: 193px;
    margin-left: 10px;
  } 
  .g_point li p:last-child span{
    font-size: 18px;
  }
  .weddingphoto{
    padding: 50px 0 60px;
  }
  .weddingphoto::before{
    content: "";
    position: absolute;
    background: url(https://www.farbeco.jp/s/images/graduation/decor.png) no-repeat;
    width: 100%;
    height: 100%;
    background-size: cover;
    top: 0;
    left: 50%;
    white-space: nowrap;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    opacity: .5;
  }
  .weddingphoto h3{
    font-size: 27px;
    text-align: center;
    margin-bottom: 50px;
    line-height: 1.8em;
  }
  .weddingphoto h3{
    margin-bottom: 20px;
    font-size: 16px;
  }
  .weddingphoto h3 span{
    font-size: 18px;
  }
  .weddingphoto li{
    width: 31%;
  }
  .weddingphoto li:nth-child(n+4){
    margin-top: 3.5%;
  }
  .g_lineup{
    padding: 50px 0 60px;
    background: url(https://www.farbeco.jp/s/images/graduation/paper2.jpg) repeat;
  }
  .g_lineup h3{
    font-size: 20px;
    margin-bottom: 40px;
  }
  .g_lineup h3 span{
    padding: 0 15px;
  }
  .g_lineup h3::before{
    top: 15px;
  }
  .g_lineup ul{
    width: 85%;
    margin: 0 auto;
  }
  .g_lineup ul li div{
    margin-top: 15px;
  }
  .g_lineup ul li img{
    border: solid 1px rgba(168, 154, 116, 0.64);
  }
  .g_lineup h4{
    font-size: 15px;
    white-space: nowrap;
  }
  .g_lineup h4 span{
    font-size: 22px;
    margin: 5px auto 0;
    padding: 8px 0 9px;
    border-top:  double 3px #a99b74;
    border-bottom:  double 3px #a99b74;
    width: 230px;
  }
  .g_morelink{
    width: 80%;
    margin: 30px auto 0;	
  }
  .g_morelink a{
    padding: 8px 0;
    font-size: 15px;
  }
  .g_line{
    font-size: 17px;
    margin-top: 60px;
  }
  .g_morelink2{
    width: 80%;
    margin: 25px auto 0;
    min-width: 250px;
  }
  .g_morelink2 a{
    padding: 15px 0;
    background: #ef7591;
    font-size: 16px;
    color: #fff;
    letter-spacing: 3px;
    position: relative;
  }
  .g_lastmessage .g_morelink2{
    width: 70%;
    margin: 35px auto 0;
  }
  .g_morelink2 a::before{
    width: 40px;
    height: 40px;
  }
  .g_morelink2 a::after{
    width: 50px;
    height: 50px;
    top: 26px;
    right: -19px;
  }
  .g_movie{
    width: 95%;
    height: 0;
    margin: 0 auto 15px;
    position: relative;
    padding-top: 53.5%;
    overflow: hidden;
  }
  .g_movie iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
  }
  .rapid_option h3{
    font-size: 20px;
  }
  .rapid_option h3 span{
    font-size: 14px;
    line-height: 1.5em;
  }
  .g_morelink3{
    width:80%;
    margin: 25px auto 0;	
    min-width: 250px;
  }
  .g_morelink3 a{
    padding: 8px 0 9px;
    font-size: 15px;
  }
  .g_custmize{
    padding: 50px 0 60px;
  }
  .g_custmize h3{
    font-size: 18px;
    padding: 4px 0 3px;
  }
  .custmizetxt{
    margin: 15px 5px 0;
  }
  .custmizetxt span{
    font-size: 17px;
  }
  .g_flow{
    margin: 25px auto 0;
  }
  .g_morelink4{
    width:80%;
    margin: 30px auto 0;	
  }
  .g_morelink4 a{
    padding: 15px 0;
    font-size: 15px;
  }
  .g_lastmessage{
    padding: 50px 0;
  }
  .g_lastmessage p:first-child{
    font-size: 20px;
    line-height: 1.8em;
    letter-spacing: 2px;
  }
}
@media screen and (max-width:350px){
  .g_gift h3 span{font-size: 19px;}
  .sp .block{display: block;}
  .g_point li p:first-child{width: 125px;}
}
.g_morelink3{
  text-align: center;
}


@media screen and (min-width:768px) and (max-width:1000px){
	.g_mainarea{width: 88%;}
	.g_to{font-size: 22px;}
	.g_giftscene li h4{font-size: 43px;}
	.g_point h3{font-size: 22px;}
	.g_point li p:last-child{font-size: 21px;}
	.g_point li p:last-child span{font-size: 23px;}
	.custmizetxt{font-size: 21px;}
	.custmizetxt span{font-size: 25px;}
}
@media screen and (min-width:768px) and (max-width:950px){
	.g_movieflex{display: block;}
  .g_movie{text-align: center;margin-left: 0;}
  .g_movie iframe{width: 499px;height:281px;margin: 0 auto 20px;}
  .g_morelink3{width: 500px;}
  .weddingphoto h3{font-size: 24px;white-space: nowrap;}
}