@charset "UTF-8";
.pc-only{
  display:none;
}
/*--------------------------------------------------
headerハンバーガーメニュー
/*----------------------------------------------------------*/
header .container #nav-toggle {
  width: 60px;
  height: 54px;
  margin-left:auto;
  right: 20px;
  margin-bottom: 70px;
  top:16px;
}
header .container #full-navi .flex li {
  margin-bottom: 16px;
}
header .container #full-navi .flex li a {
  line-height: 0.5;
  font-size: 1.5rem;
}
header .container #full-navi-back {
  top: -590px;
  left: 65px;
}
.open header .container #full-navi-back {
  width: 520px;
  height: 680px;
}
.close header .container #full-navi-back {
  width: 520px;
  height: 680px;
}
header .container #nav-toggle div:nth-child(1) {
  top: 22px;
  left: 29px;
}
.open header .container #nav-toggle div:nth-child(1) {
  top: 27px;
  left: 19px;
}
header .container #nav-toggle div:nth-child(2) {
  top: 29px;
  left: 19px;
}
.open header .container #nav-toggle div:nth-child(2) {
  top: 27px;
  left: 19px;
}
@media screen and (max-width: 768px) and (min-width: 700px) {
  header .container #full-navi-back {
    left: 440px;
  }
}
@media screen and (max-width: 700px) and (min-width: 630px) {
  header .container #full-navi-back {
    left: 475px;
  }
}
@media screen and (max-width: 630px) and (min-width: 560px) {
  header .container #full-navi-back {
    left: 480px;
  }
}
@media screen and (max-width: 560px) and (min-width: 375px) {
  header .container #full-navi-back {
    left: 30px;
  }
  .open header .container #full-navi-back {
    transform-origin: 30%;
  }
  .close header .container #full-navi-back {
    transform-origin: 30%;
  }
}
@media screen and (max-width: 375px) {
  .open header .container #full-navi-back {
    transform-origin: 50%;
  }
  .close header .container #full-navi-back {
    transform-origin: 50%;
  }
}
/*----------------------------------------------
headerヒーローエリア
/*----------------------------------------------*/
header .container{
  height:70vh;
  position:relative;
}
header .container > img {
  position: absolute;
}
header .circle-img{
  left:0;
  right:0;
  top: 142px;
  z-index: 100;
  margin:0 auto;
  width:calc(100% / 375 * 253);
}
header .logo-img{
  width:calc(100% / 1440 * 80);
  left:32px;
  top: 30px;
  min-width:80px;
}
header .kamome {
  top: 86px;
  width: 343px;
  z-index: 500;
}
header .container .kumo-left {
  top: 257px;
  width: 242px;
}
header .container .kumo-right {
  right: 0;
  top: 38px;
  width: 235px;
}
header .under-img {
  bottom: 0;
  z-index: 200;
}
@media screen and (max-width:600px){
  header .container{
    height:60vh;
  }
  header .slick10{
    top:55vh;
  }
  #notfound .slick10 {
    margin-top: 13vh;
  }
}
@media screen and (max-width:500px){
  header .container{
    height:50vh;
  }
  header .slick10 {
    top:50vh;
  }
  #notfound .slick10 {
    margin-top: 6vh;
  }
}

/*------------------------------------
top戻るボタン
------------------------------------*/
#page-top a{
  width: 50px;
  height: 50px;
  font-size:0.6rem;
}
#page-top {
  right: 12px;
  bottom: 0;
}
#page-top img {
  width: 20px;
}

/*------------------------------------
Flowerカレンダー↓
------------------------------------*/
#calender .flower {
    width: 100%;
    padding-top: 70px;
    background-color: #DAEFC1;
    padding-bottom: 20px;
}
#calender .flower .flower_main_box {
    width: 90%;
    margin: auto;
}
#calender .flower h2 {
    font-size: 32px;
}
#calender .flower .flower_box {
    text-align: left;
}
#calender .flower .flower_box p {
    font-size: 12px;
}
#calender .back_color {
    width: 100%;
    height: 55px;
    background-color:#ececec;
}
/*------------------------------------
スリックスライダー↓
------------------------------------*/
#calender .slick01 {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 39px;
}
#calender .slick02 {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 39px;
}
#calender .slick-slide img {
    height: auto;
}
#calender .sliderArea {
    max-width: 100%;
    margin: 0 auto;
    padding: 0 25px;
}
#calender .sliderArea.w300 {
    max-width: 300px;
}
#calender .slick-slide {
    margin: 0 5px;
}
#calender .slick-slide img {
    width: 100%;
}
#calender .slick-prev {
    z-index: 100;
    left: 15px;
    top: 270px;
    width: 30px;
    height: 30px;
}
#calender .slick-next {
    z-index: 100;
    right: 15px;
    top: 270px;
    width: 30px;
    height: 30px;
}
#calender .slick-prev:before, .slick-next:before {
    color: #000;
    z-index: 9;
    font-size: 30px;
}
#calender .thumb {
    margin: 20px 0 0;
}
#calender .slick-slide {
    transition: all ease-in-out .3s;
}
#calender .slick-active {
    opacity: 1;
}
#calender .slick-current {
    opacity: 1;
}
#calender .thumb .slick-slide {
    cursor: pointer;
}
#calender .thumb .slick-slide:hover {
    opacity: 0.7;
}
#calender .slick-slide {
    outline: none;
}
#calender .prev {
    position: absolute;
    z-index: 1;
    left: -20px;
    top: 80px;
}
#calender .next {
    position: absolute;
    z-index: 1;
    right: -25px;
    top: 80px;
}
#calender .fa-chevron-circle-right {
    font-size: 35px;
    color: #333;
}
#calender .fa-chevron-circle-left {
    font-size: 35px;
    color: #333;
}
#calender .fa-chevron-circle-right:hover {
    opacity: 0.6;
}
#calender .fa-chevron-circle-left:hover {
    opacity: 0.6;
}
.round_border2 {
    width: 15px;
    height: 15px;
}
/*----------------------------------------------*/
/*共通部分---------------------------------------*/
/*----------------------------------------------*/
h2{
  font-size:1.5rem;
}
p{
  font-size:1.2rem;
}
/*----------------------------------------------*/
/*price-----------------------------------------*/
/*----------------------------------------------*/
/* #price .h1-box{
  margin-top: 130px;
} */
#price li{
  letter-spacing: 2px;
}
#price .mini{
  font-size:.8rem;
}
#price .flex .flex{
  align-items: center;
  justify-content: center; 
}
#price .nengajou{
    margin-bottom: 98px;
}
#price .h2-box {
  margin-bottom: 45px;
}
#price .h2-box h2 {
  letter-spacing: 3px;
  text-indent: 3px;
  margin-left: 10px;
}
#price .nengajou .justify_c {
  width: 244px;
  margin: 0 auto;
}
#price .nengajou .post img {
  margin: 0 auto 70px;
}
#price .nengajou .box{
  justify-content:center;
  flex-direction: column;
}
#price .nengajou .box li {
  padding-top: 67px;
  text-align: center;
  width: 267px;
  height: 562px;
  border-radius: 30px;
  margin: 0 auto 28px;
  line-height:2;
  box-shadow: 5px 5px #FFECAE;
}
#price .nengajou .box li:first-child {
  margin-top: 58px;
}
#price .nengajou .box li:last-child {
  margin-bottom: 0;
}
#price .nengajou .box li .img-box {
  margin-bottom: 25px;
}
#price .nengajou .box li:nth-child(1) .img-box {
  margin-bottom: 37px;
}
#price .nengajou .box li h3 {
  font-size: 1.5rem;
  line-height: 0.5;
}
#price p.m {
  font-size: 1.5rem;
}
#price .nengajou .box li >*:nth-child(4) {
  margin-top: 68px;
  line-height: 0.5;
}
#price .nengajou .box li >*:nth-child(6) {
  line-height: 0;
  margin: 29px 0;
}
#price .nengajou .box li >*:nth-child(8) {
  line-height: 0.5;
  margin-bottom: 74px;
}
#price .nengajou .box li >*:nth-child(10) {
  line-height: 0.5;
}
#price .nengajou .list li{
  line-height:2;
  position:relative;
  padding:0 24px;
  margin:4px 0; 
}
#price .calender ul{
  justify-content: center;
}
#price .calender ul li{
  width: 263px;
  height: 363px;
  padding: 64px 0;
  margin-top: 48px;
  box-shadow: 5px 5px #FFECAE;
}
#price .calender ul li .img-box {
  margin-bottom: 68px;
}
#price .calender ul li p{
  width:100%;
  text-align:center;
}
#price .calender ul li .s {
  line-height: 0.5;
}
#price .calender .list {
  padding: 0 26px;
  margin-top: 80px;
  max-width: 560px;
}
#price .calender .list li {
  margin-top: 0;
  letter-spacing: 0;
  text-indent: -1em;
  width: auto;
  height: auto;
  padding: 0;
  box-shadow: none;
}
#price .calender .list li:before{
  content:"";
  width:8px;
  height:8px;
  background-color:#FFECAE;
  display: inline-block;
  border-radius: 2px;
}
#price .order {
  width: 140px;
  height: 32px;
  text-align: center;
  margin: 56px auto 0;
  line-height: 2.5;
}
#price .separately.pb-200 {
  padding: 0 26px 50px;
  max-width: 560px;
}
@media (min-width: 650px) {
  #price a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
  }
}
@media (max-width:500px){
  #price h1{
    font-size:2rem;
  }
  #price h2{
    font-size:1.3rem;
  }
}
/*------------------------------------
コンタクト
------------------------------------*/
#contact section #order-area #nenga-view,
#contact section #order-area #calen-view,
#contact section #order-area .tateyoko,
#contact section #order-area .calen{
  width:50%;
}
@media (max-width:600px){
  #contact section #order-area #nenga-wrap label{
    margin-right:0;
  }
}
@media (max-width:500px){
  #contact h1{
    font-size:2rem;
  }
  #contact section{
    padding: 50px 20px 30px;
    width:100%;
  }
  #contact section input,
  #contact section select,
  #contact section textarea,
  #contact section label,
  #contact section span,
  #contact section h2,
  #contact section h3,
  #contact section form p{
    font-size:1.5rem !important;
  }
  #contact section .req{
    font-size:1.2rem;
  }
  #contact .pri-link{
    font-size:1.2rem;
  }
  #contact section input[type="submit"]{
    width:140px;
    font-size:1.5rem;
    line-height: 1;
    padding:8px 40px;
    margin-top:40px;
  }
  #contact section input.your-post {
    width: 90px;
  }
  #contact section #order-area #nenga-wrap,
  #contact section #order-area #calen-wrap{
    padding:20px;
  }
  #contact section #order-area #nenga-wrap .check-wrap {
    flex-direction: column;
  }
  #contact section #order-area .kome {
    top: 4px;
  }
  #contact section #order-area #nenga-view{
    margin-top:10px;
  }
  #contact section #order-area #nenga-wrap label{
    margin-bottom:10px;
  }
  #contact section .calenp{
    margin-bottom: 10px;
  }
}
#contact section #order-area .calen .check-wrap .flex {
  margin-left: 11px;
}
#contact section #order-area .calen .check-wrap .flex label {
  margin-right: 20px;
}
/*------------------------------------
会社概要
------------------------------------*/
/* #company {
  margin-top: 74px;
} */
#company h1{
  font-size:1.5rem;
}
#company a,
#company p{
  font-size:1.2rem;
}
#company .company-text {
  padding: 40px 0;
}
/*footer---------------------------------------------*/
footer::before {
  width: 286px;
  height: 0.1rem;
  top: -115px;
}
footer .container {
  margin: 204px auto 148px;
}
footer .container > a {
  margin: auto 0;
}
footer .container a img {
  width: 75px;
  height: 30px;
}
footer .container .menu {
  margin-left: 35px;
}
footer .container .menu ul:nth-child(1) {
  margin-right: 27px;
}
footer .container .menu ul li a {
  font-size: 1.5rem;
  line-height: 0.5;
}
footer .container .menu ul .nenga {
  margin-bottom: 9px;
}
footer .container .menu ul .little {
  margin-bottom: 12px;
}
footer .container .menu ul .nenga a {
  padding: 0px 4px;
  background: #202020;
  color: #fff;
  border-radius: 3px;
}
footer .container .menu ul .little a {
  font-size: 1.2rem;
}
footer p {
  margin-bottom: 11px;
}
footer p small {
  font-size: 0.8rem;
}
/*------------------------------------
topページ 年賀状 縦書き ↓
------------------------------------*/
#top .ab_sol.tategaki {
  margin-top: 30px;
}
#top .pc-only {
  display: none;
}
#top h2 {
  font-size: 3.2rem;
}
#top .years_card {
  margin: 80px 0 0;
  padding-bottom: 30px;
}
#top .container {
  width: 80%;
  max-width: 1200px;
}
#top .mt-3 {
  margin-top: -15px;
}
#top .years_card h2 img:nth-of-type(2) {
  position: relative;
  z-index: 1000;
}
#top .writing {
  font-size: 2.6rem;
  margin-bottom: 25px;
}
#top .years_card .flex p {
  margin-top: 10px;
  padding-right: 40px;
}
#top .years_card .flex img {
  margin-right: 10px;
  width: 284px;
  height: 421px;
  margin-bottom: 70px;
}
#top .sold_out .sold_out_img.sol_img img {
  height: 110%;
}
#top .sold_out .sol_img img {
  top: 10px;
}
#top #mypage.mt-100 {
  margin-top: 0;
}
/*------------------------------------
topページ 年賀状 横書き ↓
------------------------------------*/
#top .horizontal_writing .mr_35 {
  margin-right: 35px;
}
#top .horizontal_writing .flex p {
  margin-top: 10px;
}
#top .horizontal_writing .tora3 {
  top: 50px;
  left: -100px;
  width: 400px;
}
#top .horizontal_writing .container ul li {
  margin: 17px;
}
#top .horizontal_writing .container ul li img {
  width: 420px;
  height: 282px;
}
/*------------------------------------
topページ 季節のFlowerカレンダー ↓
------------------------------------*/
#top .seasonal_calendar .mt-5 {
  position: relative;
  z-index: 1000;
  top: -40px;
  margin-top: 100px;
}
#top .seasonal_calendar .lightbox-container 
#top .seasonal_calendar .sheets2 img:first-of-type {
  margin-right: 17px;
}
#top .seasonal_calendar .sheets2 img:nth-child(2) {
  margin-left: 17px;
}
#top .seasonal_calendar .sheets2 img:nth-child(3) {
  margin-left: 35px;
}
#top .seasonal_calendar .flex img {
  width: 350px;
}
#top .seasonal_calendar .mt_40_img img {
  margin-top: 40px;
}
#top .seasonal_calendar .type {
  top: 105px;
}
/*------------------------------------
topページ 季節のFlowerカレンダー 卓上タイプ ↓
------------------------------------*/
#top .horizontal_flower .container ul li img {
  width: 300px;
}
#top .horizontal_flower .container ul li {
  margin: 19px;
}
/*------------------------------------
SP版 スリックスライダー ↓
------------------------------------*/
#top .slick01 a:hover li img {
  opacity: 0.6;
}
#top .slick02 a:hover li img {
    opacity: 0.6;
}
#top .slick-dots {
  display: none !important;
}
#top ul.slick01 li {
  margin: 0 20px;
}
#top ul.slick02 li {
  margin: 0 20px;
}
#top ul.slick03 li {
  margin: 0 20px;
}
#top .fa-chevron-circle-left:before {
  content: "\f053";
  font-size: 2rem;
  color: #D5D1D1;
  position: absolute;
  bottom: -10px;
  left: 15px;
  cursor: pointer;
}
#top .fa-chevron-circle-right:before {
  content: "\f054";
  font-size: 2rem;
  color: #D5D1D1;
  position: absolute;
  bottom: -10px;
  right: 15px;
  cursor: pointer;
}
#top .years_card .container .flex ul li {
  display: flex;
}
#top .mt-3.takutaipu {
  margin-top: -13px;
}
.lb-data .lb-number {
	display: none !important;
}
.lb-nav a.lb-prev {
  display: none !important;
}
.lb-nav a.lb-next {
  display: none !important;
}
/*-----------------------404---------------------------------*/
header .container #notfound {
  padding-top: 105px;
}
header .container #notfound > div {
  height: 130px;
}
header .container #notfound h1 {
  font-size: 7rem;
}
header .container #notfound h1 span {
  font-size: 2rem;
}
header .container #notfound p {
  font-size: 1.5rem;
  margin-bottom: 20px;
}
header .container #notfound a {
  font-size: 2rem;
  padding: 5px 10px;
}
header .notfound-slick {
  top: 8vh;
} 
/*------------------------------------
プライバシーポリシーページ ↓
------------------------------------*/
#privacy_policy .container {
  width: 90%;
  padding-top: 150px;
}
#privacy_policy h2 {
  position: relative;
  text-align: center;
}
#privacy_policy h2::after {
  content: "";
  background-color: #C1D1E0;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 144px;
  height: 3px;
  display: inline-block;
}
#privacy_policy h3 {
  font-size: 1.5rem;
  position: relative;
  text-align: center;
}
#privacy_policy h3::after {
  content: "";
  background-color: #C1D1E0;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 144px;
  height: 3px;
  display: inline-block;
}
#privacy_policy h3.sp_color::after {
  background-color: #EFE5CB;
}
#privacy_policy p {
  font-size: 1.2rem;
  padding: 18px 0 18px 0;
}
#privacy_policy .container .ulli_list {
  padding-bottom: 10px;
}
#privacy_policy .container ul {
  margin-left: 20px;
  margin-bottom: 30px;
}
#privacy_policy .container ul li {
  font-size: 1.2rem;
}
#privacy_policy p.pb-30 {
  padding-bottom: 30px;
}
#privacy_policy .container .company_profile {
  padding: 0 0 0 25px;
}
/*------------------------------------
季節のFlowerカレンダー 卓上タイプ A B 各種コンテンツ↓
------------------------------------*/
#mypage .favorite_information_box {
  margin-top: 66px;
  padding-bottom: 64px;
  border-bottom: 1px solid #000;
}
#mypage .favorite_information_box h2 {
  font-size: 20px;
}
#mypage .favorite_information_box .article_box {
  margin-top: 27px;
}
#mypage .favorite_information_box .information_article p {
  font-size: 13px;
  margin-right: 12px;
  margin-bottom: 9px;
}
#mypage .recommended_content #a-line {
  background-image: url(../images/masuku.png);
  width: 100%;
  padding-bottom: 100px;
}
#mypage .recommended_content #ka-line {
  background-image: url(../images/masuku2.png);
  width: 100%;
  padding-bottom: 100px;
}
#mypage .favorite_information_box .information_article p:nth-child(3) {
  font-size: 16px;
}
#mypage .favorite_information_box .information_article .society_box {
  padding: 4px 10px;
  font-size: 9px;
}
#mypage .favorite_information_box .allview-btn {
  width: 182px;
  height: 30px;
  line-height: 30px;
  letter-spacing: .15em;
  font-size: 11px;
  top: 0;
  right: 0;
  padding-right: 10px;
}
#mypage .favorite_information_box .allview-btn:after {
  width: 10px;
  height: 10px;
  background: url(../img/common/arrow-circle-right.svg) no-repeat center/contain;
  right: 10px;
}
#mypage .search .e-search {
  margin-top: 27px;
  margin-left: 0;
  display: flex;
  margin-bottom: 9px;
}
#mypage .search .e-search li {
  width: calc((100% / 3) - 1px);
  margin-right: 10px;
  margin-left: 10px;
  margin-top: 10px;
  height: 50px;
  line-height: 83px;
}
#mypage .search .e-search li:nth-child(5n) {
  margin-right: 0;
}
#mypage .search .e-search li.a-line a {
  font-size: 16px;
}
#mypage .search .e-search li.ka-line a {
  font-size: 16px;
}
#mypage .slick-list {
  margin-top: 40px;
}
@media screen and (max-width: 768px) {
#mypage .search {
  margin-top: 20px;
  }
#mypage .search h2 {
  font-size: 20px;
  }
#mypage .search .e-search li {
  height: 40px;
  line-height: 50px;
  }
#mypage .search .e-search li:nth-child(5n) {
  margin-right: 0;
  }
#mypage .search .e-search li a {
  font-size: 13px;
  }
#mypage .search .e-list li a {
  font-size: 13px;
  }
}
#mypage .search .e-list.is-active ul {
  display: block;
}
@media screen and (max-width: 500px) {
#mypage .search .e-search li{
  width: 100%;
  }
}
/*------------------------------------
料金↓
------------------------------------*/
