@charset "utf-8";


/* --------------------------------
	カスタムcss(フロント)
-------------------------------- */

/* ----------
　　body部リセット
 ----------- */
body {
    background-color: none;
}
#header {
   padding-top: 20px;
  /* background: #FBFBFB; */
    background: #EEF9FF;
}
#contents {
  /* background: #FBFBFB; */
    background: #EEF9FF;
}
#header2 {
    background: #fff;
    /* margin: 0 20px 0 20px; */
    margin: 0 6% 0 6%;
    border-radius: 15px 15px 0 0 / 15px 15px 0 0;
    -webkit-border-radius: 15px 15px 0 0 / 15px 15px 0 0;
    -moz-border-radius: 15px 15px 0 0 / 15px 15px 0 0;
    border-top: 1px solid #ccc ;
    border-left: 1px solid #ccc ;
    border-right: 2px solid #b8bec4 ;
    padding-top: 10px;
}
#contents2 {
    background: #fff;
    /* margin: 0 20px 0 20px; */
    margin: 0 6% 0 6%;
    border-radius: 0 0 15px 15px / 0 0 15px 15px;
    -webkit-border-radius: 0 0 15px 15px / 0 0 15px 15px;
    -moz-border-radius: 0 0 15px 15px / 0 0 15px 15px;
    border-bottom: 2px solid #b8bec4 ;
    border-left: 1px solid #ccc ;
    border-right: 2px solid #b8bec4 ;
    padding-top: 1%;
}
#contents_bottom{
  padding-bottom: 20px
}
#footer {
    margin-top: 20px;
    background: #AAD6EC;
}

/* プライバシーポリシーやお問い合わせの背景 heder2やcontents2と同じ色にすること*/
#contents .main_only{
  background: #fff;
  border-radius: 10px;
}
/* Tablet */
@media only screen and (max-width: 1030px) {
  #header {
     padding-top: 8px;
  }
  #header2 {
      margin: 0 3% 0 3%;
  }
  #contents2 {
    margin: 0 3% 0 3%;
  }
  #footer {
      margin-top: 8px;
  }
}
/* SP */
@media only screen and (max-width: 767px) {
}
/* ニュース-背景色 */
#news_area {
	background: #AAD6EC;
  color:#fff
}
/* ニュース-まるアイコン */
.newslist dt .angle-circle{
  /* background: grey; */
}
/* ニュース-詳しくはこちらボタン */
.right{
  text-align: right;
}

/* スマホメニュー */
#search {
	background: #F6F6F6;
}

/* アイコンカラー */
/* 会員 */
.icon-bg {
    fill: #4072B3;
}
/* お気に入り */
.icon-bg_heart {
    fill: #E91E63;
}
/* ログイン */
.icon-bg_lock {
    fill: #F7D76B;
}
/* ショッピングカート */
.cb-shopping-cart,
.cb-close{
    fill: #EB8686;
}
/* 入会方法 */
.icon-question-bg {
    fill: #cccccc;
}

/* ボタンー角丸 */
.btn{
  /* border-radius: 10px; */
}
/* TOP PLACE MALLについて */
.info_photo {
    display: block;
    margin: 0 0 8px;
    text-align: center;
}
.info_photo img {
    max-width: 100px;
    max-height: 100px;
}
.info_name {
    font-size: 18px;
    font-weight: bold;
    margin: 0 0 8px;
    padding-left: 8px;
    text-align: center;
}
.info_txt_center {
	  text-align: center;
    margin: -10px;
    font-size: 15px;
}

.product_line{
  margin-top: -15px;       /* 上線の外側の余白はナシ */
  padding-top:  -15px;      /* 上線の内側の余白はナシ */
  border-bottom: solid 1px #d9d9d9;
}
/* 商品一覧(パネル角丸) */
.product_item{
  background-color: #fbfbfb ;
  border-top:solid 1px #ccc;
  border-right:solid 1px #ccc;
  border-left:solid 1px #ccc;
  border-bottom:solid 1px #ccc;
  /* box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05); */
  border-radius: 5px;
}
.product_item a:hover {
    /* border-top:solid 1px #ccc; */
    /* border-right:solid 2px #ccc; */
    /* border-left:solid 1px #ccc; */
    /* border-bottom:solid 2px #ccc; */
    /* box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05); */
    text-decoration: none;
    border-radius: 5px;
    /* box-shadow: 5px 5px 10px -2px rgba(0, 0, 0, 0.29); */
    box-shadow: 0 2px 10px rgba(0,0,0,.2)
}
.product_item a:hover img {
    opacity: 1;
}

/* 商品一覧ー画像(上だけ角丸) */
.imgrad img{
  border-radius: 5px 5px 0 0 / 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0 / 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0 / 5px 5px 0 0;
}

/* 商品名PC */
.item_name_p {
    font-weight: bold;
    color: #5b5b5b;
    margin: 0 0 8px;
    padding-left: 10px;
    padding-right: 10px;
/* add 何かで追加したが商品詳細ページのタイトル位置がずれたためコメント */
    height: 65px;
}


/* マイページタイトル */
.page-heading{
  position: relative;
  display: inline-block;
  font-weight: bold;
  padding: 0.25em 0;
  text-decoration: none;
}

/* マイページナビ */
.local_nav li a{
  display: inline-block;
  /* padding: 1em 3em; */
  text-decoration: none;
  background: #f7f7f7;
  border-left: solid 6px #5cb1b1;/*左線*/
  color: #2e3233;/*文字色*/
  /* font-weight: bold; */
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
  width: 100%;
}
.local_nav li a:hover{
  border-left: solid 6px #5cb1b1;/*左線*/
  box-shadow: inset 0 0 2px rgba(128, 128, 128, 0.1);
  transform: translateY(2px);
 }
.local_nav li.active a{
  border-left: solid 6px #DE5D50;/*左線*/
  box-shadow: inset 0 0 2px rgba(128, 128, 128, 0.1);
  transform: translateY(2px);
  pointer-events : none;/*ボタンイベント無効*/
}
/* マイページー注文履歴詳細ータイトル */
#shopping_confirm .heading02 {
  display: inline-block;
  padding: 0.5em 1em;
  text-decoration: none;
  background: #f7f7f7;
  border-left: solid 6px #1da1f3;/*左線*/
  color: #2e3233;/*文字色*/
  font-weight: bold;
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
  width:100%;
}
/* マイページー注文履歴詳細ー金額 */
#shopping_confirm .total_box{
  background: #f7f7f7;
}

/* マイページー注文履歴一覧 */
.btn-list{
  position: relative;
  display: inline-block;
  padding: 0em;
  text-decoration: none;
  color: #FFF;
  background: #F5F7F8;
  border-radius: 5px;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  font-weight: bold;

  border-top:solid 1px #ccc;
  border-right:solid 2px #b8bec4;
  border-left:solid 1px #ccc;
  border-bottom:solid 2px #b8bec4;

}
.btn-list:hover{
  background: #AAD6EC;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}


/* カートー入会内容 */
div.table ol li{
  background: #f7f7f7;
}
/* ヘッダーカート */
#cart .inner{
  background: #f7f7f7;
  border-top:solid 1px #ccc;
  border-right:solid 2px #b8bec4;
  border-left:solid 1px #ccc;
  border-bottom:solid 2px #b8bec4;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
}
/* 会員登録-フォーム */
.form-group .form-control{
  background-color: #ffffee
}
#contact_contents {
  background: #ffffee;
}

/* アニメーション */
.effect i {
  height: 0px;
  padding: 0px;
  font-size: 100px;
  transition: .8s;
}
.effect div {
  margin: auto;
  transition: .8s;
  transition-delay: .8s;
}
/* 商品名改行など */
.list_item_name {
    float : right;
    font-weight: bold;
    font-size: 14px;
    color: #5b5b5b;
    width: 160px;
    padding: 0px 0px 0px 0px;
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

/* 商品価格(付箋風) */
#detail_description_box__sale_price
,#detail_description_box__class_range_sale_price
,#detail_description_box__class_sale_price
{
    display: inline-block;
    padding: 1.5em 3em;
    text-decoration: none;
    font-size: 85%;
    background: #f7f7f7;
    border-left: solid 6px #fd7171;/*左線*/
    /* font-weight: bold; */
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
    width: 100%;
}
/* カートープラン */
.cart .item_box .item_pattern{
  padding: 0;
  float: right;
}
/* 入会内容ープラン */
.item_pattern {
  padding-left: 10px;
  padding-right: 10px;
  color: #DE5D50;
  font-weight: bold;
}
/* topページのアニメーション */
/* 画面外にいる状態 */
.fadein {
    opacity : 0;
    transform : translate(0, 100px);
    transition : all 1000ms;
    }
/* 画面内に入った状態 */
.fadein.scrollin {
    opacity : 1;
    transform : translate(0, 0);
    }
    /* 2つ目の要素にdelayをかける */
    .fadeT2 {
        -moz-transition-delay:150ms;
        -webkit-transition-delay:150ms;
        -o-transition-delay:150ms;
        -ms-transition-delay:150ms;
        }
    /* 3つ目の要素にdelayをかける */
    .fadeT3 {
      -moz-transition-delay:300ms;
      -webkit-transition-delay:300ms;
      -o-transition-delay:300ms;
      -ms-transition-delay:300ms;
        }
    /* 4つ目の要素にdelayをかける */
    .fadeT4 {
      -moz-transition-delay:600ms;
      -webkit-transition-delay:600ms;
      -o-transition-delay:600ms;
      -ms-transition-delay:600ms;
        }

/* スマホ向け */
@media screen and ( max-width:767px )
{
  /* topページのアニメーション */
  /* 画面外にいる状態 */
  .fadein {
    opacity : 0;
    transform : translate(0, 50px);
    transition : all 1200ms;
      }

  /*Topページ*/
  .info_photo p{
      color: #000000;
    　font-weight: bold;
  }
  .info_photo img {
      max-width: 50px;
      max-height: 50px;
      color: #000000;
    　font-weight: bold;
  }
  .info_name {
      font-size: 15px;
  }

  /*商品リスト*/
  .list_item_photo img {
      max-width: 95%;
  }
  .list_item_name {
      float : right;
      font-weight: bold;
      font-size: 14px;
      color: #5b5b5b;
      width: 160px;
      padding: 0px 0px 0px 0px;
      overflow : hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
  }
  .list_item_price {
  /* 商品一覧の金額部分 */
      font-size: 13px;
      font-weight: bold;
      color: #5b5b5b;
      text-align:  right;
      vertical-align: bottom;
  }
  .input_tel input {
      max-width: 4em;
  }
#cart .inner{
    margin-top: 0;
}
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.phone { display: none !important; }

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 767px) {
    .pc { display: none !important; }
    .phone { display: block !important; }
}

/* テキストの左右のボーダー */
.textborder {
	color: #5b5b5b;
	font-size: 20px;
	display: flex;
	align-items: center;
}
.textborder:before, .textborder:after {
	content: "";
	flex-grow: 1;
	height: 1px;
	display: block;
}
.textborder:before {
	margin-right: .4em;
	background: linear-gradient(-90deg, #888, transparent);
}
.textborder:after {
	margin-left: .4em;
	background: linear-gradient(90deg, #888, transparent);
}


/* ページスクロール */
.pagetop {
    font-size: 10px;
    display: none;
    position: fixed;
    border-radius: 50px;/*角の丸み*/
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);

}
.pagetop i {
  padding-top: 6px
}
.pagetop a {
    display: block;
    text-align: center;
    color: #222;
    font-size: 15px;
    text-decoration: none;
    padding: 12px 0px;
	　filter:alpha(opacity=50);
    -moz-opacity: 0.5;
/*    opacity: 0.5;*/
    background-color: #F99292;
    color: #fff;
    font-weight: bold;
}
.pagetop a:hover {
  text-decoration: none;
  opacity: 0.9;
  /*    opacity: 0.5;*/
}


/* ボタン(入会するなど) */
.btn-primary{
  position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF;
  background: #fd7171;/*色*/
  border-radius: 5px;/*角の丸み*/
  font-weight: bold;
  border-top:solid 1px #fd7171;
  border-right:solid 2px #ef4d4d;
  border-left:solid 1px #fd7171;
  border-bottom:solid 2px #ef4d4d;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
}
.btn-primary:hover{
  background: #f77373;/*色*/
  /* border: solid 2px #ef4d4d;/*線色*/ */
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

/* ボタン(変更するなど) */
.btn-info{
  position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF;
  background: #5b5b5b;/*色*/
  border-radius: 5px;/*角の丸み*/
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  font-weight: bold;
}
.btn-info:hover{
  background: #4c4c5c;/*色*/
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

/* ボタン(キャンセルなど) */
.btn-default{
  position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: grey;
  background: #F5F7F8;/*色*/
  border-radius: 5px;/*角の丸み*/
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  font-weight: bold;
}
.btn-default:hover{
  background: #e1e6e8;/*色*/
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

/* ボタン(ユーザーログイン) */
.btn-user{
  position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF;
  background: #F99695;/*色*/
  border-radius: 5px;/*角の丸み*/
  font-weight: bold;
  border-top:solid 1px #F99695;
  border-right:solid 2px #F99695;
  border-left:solid 1px #F99695;
  border-bottom:solid 2px #F99695;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  width: 100%;
}
.btn-user:hover{
  background: #ffa7a6;/*色*/
  color: #FFF;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
}
/* ボタン(オーナーログイン) */
.btn-owner{
  position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF;
  background: #9DDCDC;/*色*/
  border-radius: 5px;/*角の丸み*/
  font-weight: bold;
  border-top:solid 1px #9DDCDC;
  border-right:solid 2px #9DDCDC;
  border-left:solid 1px #9DDCDC;
  border-bottom:solid 2px #9DDCDC;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  width: 100%;
}
.btn-owner:hover{
  background: #a7e8e8;/*色*/
  color: #FFF;
  /* border: solid 2px #ef4d4d;/*線色*/ */
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
}
/* ボタン(マイページ) */
.btn-mypage{
  position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF;
  background: #6088C6;/*色*/
  border-radius: 5px;/*角の丸み*/
  font-weight: bold;
  border-top:solid 1px #6088C6;
  border-right:solid 2px #6088C6;
  border-left:solid 1px #6088C6;
  border-bottom:solid 2px #6088C6;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  width: 100%;
}
.btn-mypage:hover{
  background: #648ed0;/*色*/
  color: #FFF;
  /* border: solid 2px #ef4d4d;/*線色*/ */
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
}

/* マイページ詳細ボタン サイズ変更 */
.btn-detail{
  padding: 1em 1.5em;
}


/* PC */
/* 商品詳細のタイトル */
.isometric {
    color: #484848;
    display: inline-block;
    height: 45px;
    font-size: 20px;
    line-height: 40px;
    background: #f7f7f7;
    text-decoration: none;
    box-sizing: border-box;
    margin-left: 3px;
}
.isometric .iconback{
    display: inline-block;
    width: 35px;
    height: 45px;
    text-align: center;
    color: white;
    vertical-align: middle;
}
.isometric span{
    vertical-align: middle;
}
.isometric .iconback .fa{
    line-height: 46px;
    font-size:15px;
}
.isometric .btnttl{
    display: inline-block;
    width: 210px;
    height: 45px;
    text-align: left;
    padding-left: 10px;
    border-bottom: solid 4px #dcdcdcbd;
    vertical-align:middle;
    font-weight: bold;

    border-top:solid 1px #ccc;
    border-right:solid 1px #ccc;
}
.isometric .istw{
    background:#1da1f3;
    border-bottom: solid 4px #1484ca;
}
.isometric .isfb{
    background:#3b75d4;
    border-bottom: solid 4px #2a5caf;
}
.isometric .isfdly{
    background:#7ece46;
    border-bottom: solid 4px #65b130;
}
.isometric .ispkt{
    background:#fd7171;
    border-bottom: solid 4px #ef4d4d;
}
@media only screen and (max-width: 1030px) {
}
/* SP */
@media only screen and (max-width: 767px) {
}

/* 背景パネル */
.panel {
  position: relative;
  background: #FAFAFA;
  border-radius: 5px;
  border-top:solid 1px #ccc;
  border-right:solid 2px #b8bec4;
  border-left:solid 1px #ccc;
  border-bottom:solid 2px #b8bec4;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  /* margin-bottom: 15px; */
  margin: 0px 0px 10px 0px;
  display: block;
  padding: 10px 0;
}
.panel-marginlf{
  margin-left: 8px;
  margin-right: 8px;
}
.panel-bottom{
  padding-bottom: 20px;
  margin-top: -15px;
}
.panel-text img{
  width: 100%;
}
.panel-text{
  padding-left: 10px;
  padding-right: 10px;
}
.form-control{
  position: relative;
  background: #FAFAFA;
  border-radius: 5px;
  border-top:solid 1px #ccc;
  border-right:solid 2px #b8bec4;
  border-left:solid 1px #ccc;
  border-bottom:solid 2px #b8bec4;
  box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), inset 0 -2px 0 rgba(0, 0, 0, 0.05);
  /* margin-bottom: 15px; */
  /* margin-left: 10px; */
  /* display: block; */
}

.login_title{
  font-size: 13px;
  font-weight:  bold;
  padding-top: 10px;
}
/* facebookログイン */
/* PC */
.fblogin{
    padding-left: 13%;
    padding-right:13%;
}
.fbcomment{
    font-size: 12px;
    padding-left: 13%;
    padding-right: 13%;
    padding-bottom: 5%;
}

.fl_fb2 {/*ボタンの下地*/
  color: #FFF;/*文字・アイコン色*/
  border-radius: 5px;/*角丸に*/
  display: inline-block;
  height: 50px;/*高さ*/
  width: 100%;/*幅*/
  text-align: center;/*中身を中央寄せ*/
  font-size: 20px;/*文字のサイズ*/
  /*line-height: 47px;/*高さと合わせる*/
/*  vertical-align: middle;*//*垂直中央寄せ*/
  background: #4966a0;
  overflow: hidden;/*はみ出た部分を隠す*/
  text-decoration:none;/*下線は消す*/
  border-color: #3b6b94;
  margin-bottom: 0;
}

.fl_fb2 .fa-facebook {
    text-shadow: 2px 2px 1px #224282;
    font-size: 30px;
}

.fl_fb2 span {/*テキスト*/
  display:inline-block;
  transition: .5s;
  font-size: 13px;
  font-weight: bold;
  padding-left: 5px;
  padding-right: 5px;
}

.fl_fb2:hover span{/*ホバーで一周回転*/
  -webkit-transform: rotateX(360deg);
  -ms-transform: rotateX(360deg);
  transform: rotateX(360deg);
}

/* Tablet */
@media only screen and (max-width: 1030px) {
    .fblogin{
        padding-left: 13%;
        padding-right:13%;
    }
    .fbcomment{
        font-size: 10px;
        padding-left: 13%;
        padding-right:13%;
    }
}
/* SP */
@media only screen and (max-width: 767px) {
    .fblogin{
        margin-top:0px;
        padding-left: 10%;
        padding-right:10%;
        max-width:100%;
    }
    .fbcomment{
        font-size: 10px;
        padding-left: 10%;
        padding-right:10%;
    }
}


/* トップページ　PLACE MALLへようこそのリボン */
.ribbon_box {
    display: block;
    position: relative;
    margin: 0 auto;
    padding: 20px 0;
    width: 300px;
    background: #f1f1f1;
  }
.ribbon17 {
    display: inline-block;
    position: absolute;
    left: 0;
    top: 15px;
    box-sizing: border-box;
    padding: 0 12px;
    margin: 0;
    /* height: 30px; */
    line-height: 30px;
    font-size: 15px;
    letter-spacing: 0.1em;
    color: white;
    background: #6088C6;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.12);
}
.ribbon17:before {
    position: absolute;
    content: '';
    top: 0;
    left: -7px;
    border: none;
    height: 58px;
    width: 7px;
    background: #6088C6;
    border-radius: 5px 0 0 5px;
}
.ribbon17:after {
    position: absolute;
    content: '';
    bottom: -7px;
    left: -5px;
    border: none;
    height: 7px;
    width: 5px;
    background: #4072B3;
    border-radius: 5px 0 0 5px;
}


/* ripple ボタンエフェクト jsとセット */
.ripple {
  position: relative;
  overflow: hidden;
}

.ripple .rp-effect {/*エフェクト*/
  position: absolute;
  border-radius: 50%;
  opacity: 0.35;/*波紋の濃さ*/
  transform: scale(0);
  background: #FFF;/*波紋色*/
  animation: ripple 700ms;
  pointer-events: none;
}

@-webkit-keyframes ripple {
  to {
    opacity: 0;
    transform: scale(2.0);
  }
}

@keyframes ripple {
  to {
    opacity: 0;
    transform: scale(2.0);
  }
}

/* インスタ風ボタン */
.insta_btn3 {/*ボタンの下地*/
  color: #FFF;/*文字・アイコン色*/
  border-radius: 14px;/*角丸に*/
  position: relative;
  display: block;
  height: 120px;/*高さ*/
  width: 120px;/*幅*/
  text-align: center;/*中身を中央寄せ*/
  padding-top: 12px;/*上側との余白*/
  box-sizing: border-box;
  font-size: 19px;/*文字のサイズ*/
  background: -webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
  background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;/*グラデーション①*/
  overflow: hidden;/*はみ出た部分を隠す*/
  text-decoration:none;/*下線は消す*/
}

.insta_btn3:before{/*グラデーション②*/
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;/*全体を覆う*/
  height: 100%;/*全体を覆う*/
  background: -webkit-linear-gradient(15deg, #ffdb2c, rgb(249, 118, 76) 25%, rgba(255, 77, 64, 0) 50%) no-repeat;
  background: linear-gradient(15deg, #ffdb2c, rgb(249, 118, 76) 25%, rgba(255, 77, 64, 0) 50%) no-repeat;
}

.insta_btn3 div {
  position: relative;
}

.insta_btn3 .fa-instagram {
    font-size: 70px;/*アイコンサイズ*/
    position: relative;
    display:inline-block;
    position: relative;
    transition: .5s
}

.insta_btn3 .fa-instagram:hover {/*ホバーで一周回転*/
  -webkit-transform: rotateX(360deg);
  -ms-transform: rotateX(360deg);
  transform: rotateX(360deg);
}

.newprotitle {
  border-bottom: solid 3px #8EDAE5;
  position: relative;
}
.newprotitle:before {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #FFB23B;
  bottom: -3px;
  width: 30%;
}