@charset "UTF-8";
/*******************************************************************
* Name : BootPress media Original basic CSS Ver. 0.5
* Date : 2017.1.2 20:00
* Site URL : http://bp-media.iaowd.com/
* Code licensed MIT. For details, see http://en.wikipedia.org/wiki/MIT_License
* Author : Kenji Natsumoto
* Thanks for Jonathan Snook(SMACSS) and many more...
* *****************************************************************/
/*-----------------------------------------------------
* INDEX v.1.2
1.  BASE
1-1.  General Settings (for HTMLtag Direct)
1-2.  Web Font
1-2-1.  GOOGLE NOTO FONTS
1-3.  Clearfix
1-4.  scrollbar

2.  LAYOUT (and UI)
2-1.  l-header
2-2.  l-globalNav
2-3.  l-toggle (humberger icon)
2-4.  l-drawer (drawer plugin)
2-5.  l-swipe (swipe and touch plugin)
2-6.  l-cover
2-7.  l-localNav
2-8.  l-footer
2-9.  l-footerNav
2-10. misc
2-10-1.  CSS Framework Customize

3.  MODULE
3-1.  viUnit
3-2.  scrollUpIcon
3-3.  scrollDownIcon
3-4.  socialListUnit
3-5.  coverUnit
3-5-1.  coverUnit-head
3-5-2.  coverUnit-body
3-5-3.  coverUnit-foot
3-6.  heroBotton
3-7.  heroFigure
3-8.  verticalSpace
3-9.  horizontalSpace (ad Padding)
3-10.  headingAccent
3-11.  buttonUnit
3-12.  formUnit
3-13.  fluidModal
3-14.  shadowEffect
3-15.  copyrightUnit
3-16.  dividerUnit
3-17.  dividerUnit
3-18.  tableUnit
3-98.  misc
3-99.  CSS Framework Customize

4.  STATE
4-1.  is-navbarNavUnit-active

5.  THEME
5-1.  generalColor
5-2.  layoutColor
5-3.  moduleColor
5-3-1.navbarNavUnit
5-3-2.socialListUnit
5-3-3.utilityNavUnit
5-4.  ColorPlan(Color Pallet)
5-4-1.backgroundColor
5-4-2.textColor
5-5.  textSize
5-6.  misc
* ----------------------------------------------------- */
/* =============================================================== *
 *  1.  BASE
 * =============================================================== */
/*    1-1.  General Settings (for HTMLtag Direct)  160120再チェック
 * ------------------------------------------------------ */
html {
  /*  overflow-y:scroll;はカーソルでスクロールが効かなくなるので入れない   */
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  }
body {
  margin: 0;
  overflow-x: hidden;
  min-height: 100%;
  font-family: sans-serif, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'Meiryo';
  /* 141122更新：Lucida Grandeを指定すればヒラギノ角ゴは自動で出るが */
  /* Macでメイリオが入っている場合（つまりMS Officeをインストールしてる場合）、Lucida Grandeの代替えとしてのヒラギノ角ゴが効かず */
  /* その次の指定であるメイリオが出てしまうので、ヒラギノ角ゴは必要　＝＞いまのところこれがベスト */
  font-size: 0.9rem;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  /* text-rendering: 文字をレンダリングしてくれるCSSのプロパティ　*/
  /* optimizeLegibility = ユーザエージェントが速度、読みやすさ、幾何学的な正確さの適切なバランスをとる 読みやすさが最重要視される */
  /* カーニングと合字 (リガチャ) をうまい具合に調整してくれる */
  /* 'Noto Sans Japanese' 削除。スピードのため */ }
body .sans-serif {
    font-family: "Lucida Grande","Hiragino Kaku Gothic ProN","Meiryo",sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 0;
    margin-top: 0;
    padding-bottom: 0;
    padding-top: 0;
}
strong {
    font-family: "Lucida Grande","Hiragino Kaku Gothic ProN","Meiryo",sans-serif;
    font-weight: 900;
}
hr {
    display: none;
}
ul, ol {
    font-size: 1rem;
    list-style: outside none none;
    padding-left: 0;
}
article, section {
    margin-top: 0 !important;
}
body {
}

@media print, screen and (min-width: 768px) {
body {
    font-size: 1.2em;
    line-height: 1.7;
}
}
/*    1-2.  Web Font
 * ------------------------------------------------------ */
/******** 1-2-1.  GOOGLE NOTO FONTS  ****/
@font-face {
    font-family: "Noto Sans Japanese";
    font-style: normal;
    font-weight: 100;
    src: url("//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Thin.woff2") format("woff2"), url("//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Thin.woff") format("woff"), url("//fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Thin.otf") format("opentype");
}
.NotoSansJP-Thin {
    font-family: "Noto Sans Japanese";
}
[class^="NotoSansJP-Thin"] {
    font-family: "Noto Sans";
    margin: 0;
    padding: 0;
}
.notoSansJP100 {
    font-weight: 100;
}
.notoSansJP200 {
    font-weight: 200;
}
.notoSansJP300 {
    font-weight: 300;
}
.notoSansJP400 {
    font-weight: 400;
}
.notoSansJP500 {
    font-weight: 500;
}
.notoSansJP600 {
    font-weight: 600;
}
.notoSansJP700 {
    font-weight: 700;
}
.notoSansJP800 {
    font-weight: 800;
}
.notoSansJP900 {
    font-weight: 900;
}
/*    1-3.  Clearfix
 * ------------------------------------------------------ */
div::after, ul::after {
    clear: both;
    content: "";
    display: block;
}
/*    1-4.  scrollbar
 * ------------------------------------------------------ */
/* =============================================================== *
  *  2.  LAYOUT (and UI)
  * =============================================================== */
/*    2-1.  l-header
  * ------------------------------------------------------ */
/*    2-2.  l-globalNav
  * ------------------------------------------------------ */
@media print, screen and (min-width: 768px) {
.l-globalNav {
    left: 146px;
    margin-top: 0;
    position: relative;
    width: auto;
}
.l-globalNav-main {
    bottom: 0;
    margin-left: 0;
    position: absolute;
}
.l-globalNav-sub {
    height: 78px;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1;
}
.navbarNavUnit-sub {
    margin-top: 14px;
}
.navbarNavUnit-sub a:hover {
    padding-top: 0;
}
}
@media print, screen and (min-width: 768px) {
.l-globalNav-sub a:link, .l-globalNav-sub a:visited {
    display: block;
    padding: 14px 24px;
    top: 0;
}
.l-globalNav-sub a:hover {
    display: block;
    padding: 14px 24px;
}
}
/*    2-3.  l-toggle (humberger icon)
  * ------------------------------------------------------ */
.navbar-toggle {
    background-color: transparent;
    background-image: none;
    border: 0 solid transparent;
    border-radius: 0;
    float: right;
    margin-bottom: 0;
    margin-right: 0;
    margin-top: 0;
    padding: 8px 8px 0;
    position: relative;
}
.navbar-toggle:focus {
    outline: 0 none;
}
.navbar-toggle .icon-bar {
    border-radius: 0;
    display: block;
    height: 2px;
    width: 26px;
}
.navbar-toggle .icon-bar + .icon-bar {
    margin-top: 4px;
}
@media print, screen and (min-width: 768px) {
.navbar-toggle {
    display: none;
}
}
/*    2-4.  l-drawer (drawer plugin)
  * ------------------------------------------------------ */
/*    2-5.  swipe and touch
  * ------------------------------------------------------ */
/*    2-6.  l-cover
  * ------------------------------------------------------ */
.l-cover {
    margin-bottom: -10px;
    margin-top: 50px;
    padding: 0;
}
.l-cover2 {
    margin-bottom: -10px;
    margin-top: 50px;
    padding: 0;
}
.l-cover3{
    margin-top: 10px;
}
.l-cover4{ margin-top: 58px;
}
.l-cover5{ margin-top: 58px;
}
@media print, screen and (min-width: 768px) {
.l-cover_ffcc33 {
    margin-bottom: 0;
    margin-top: 58px;
    padding: 0;
}
}
@media print, screen and (min-width: 768px) {
.l-cover_ffcc33 {
    margin-bottom: 0;
    margin-top: 58px;
    padding: 0;
}
}

.l-cover_ffcc33 {
    background: #ffcc33 none repeat scroll 0 0;
}


@media print, screen and (min-width: 768px) {
.l-cover {
    margin-bottom: 0;
    margin-top: 58px;
    padding: 0;
}
}
@media only screen and (max-width:  501px) {
.l-cover2 {
    margin-bottom: 0;
    margin-top: 10px;
    padding: 0;
}
.l-cover5{ margin-top: 10px;
}
}
/*    2-7.  l-localNav
  * ------------------------------------------------------ */
/*
  l-localNav-main
  navListUnit
  localNavUnit
  */
/*    2-8.  l-footer
  * ------------------------------------------------------ */
.l-footer {
    position: relative;
}
.l-footerAbove {
    padding: 24px 0;
}
.l-footeBelow {
    padding: 24px 0;
}
/*    2-9.  l-footerNav
  * ------------------------------------------------------ */
.m-sitemapHeading {
    margin-top: 0;
    padding-top: 0;
}
/*    2-10. misc
  * ------------------------------------------------------ */
/******** 2-10-1.  CSS Framework Customize  ****/
.container-liquid {
    margin: 0 auto;
    max-width: 100%;
	margin-left: auto;
    padding-left: 0;
    padding-right: 0;
}
.row-liquid {
    margin: 0;
}
.no-gutter > [class*="col-"] {
    padding-left: 0;
    padding-right: 0;
}
.navbar {
    border: 0 none !important;
}
.btn-xl {
    border-radius: 6px;
    font-size: 2em;
    padding: 18px 24px;
}
/* =============================================================== *
  *  3.  MODULE
  * =============================================================== */
/*    3-1.  viUnit
  * ------------------------------------------------------ */
.viUnit {
    display: block;
    height: 42px;
    width: auto;
}
@media print, screen and (min-width: 768px) {
.viUnit {
    height: 58px;
    width: auto;
}
}
.viUnit-mono {
    display: block;
    height: 40px;
    width: auto;
}
@media print, screen and (min-width: 768px) {
.viUnit-mono {
    height: 58px;
    width: auto;
}
}
/*    3-2.  scrollUpIcon (scroll-top and page-scroll)
  * ------------------------------------------------------ */
.scroll-top {
    position: absolute;
	bottom: 0;
    height: 80px;
    right: 0;
    width: 80px;
    z-index: 10;
}
.scroll-top .btn {
    border-radius: 0;
    font-size: 40px;
    height: 80px;
    line-height: 52px;
    width: 80px;
}
.scroll-top .btn:focus {
    outline: 0 none;
}
.scroll-top a:link, .scroll-top a:visited {
    font-weight: normal;
}
/*    3-3.  scrollDownIcon
  * ------------------------------------------------------ */
/*    3-4.  socialListUnit
  * ------------------------------------------------------ */
.m-socialIcon {
    border-radius: 100%;
    display: inline-block;
    height: 50px;
    line-height: 45px;
    text-align: center;
    width: 50px;
}
.m-socialIcon-outline {
    border: 2px solid;
    font-size: 28px;
    margin-top: 0;
    transition: all 0.3s ease-in-out 0s;
}
/*    3-5.  coverUnit
  * ------------------------------------------------------ */
/*     2-6.  l-coverfullScreen cover v2.1
   * ------------------------------------------------------ */
.box {
  width: 100vw;
  height: 100vh; }

@media only screen and (max-width: 320px) and (max-width:  501px) {
  .box {
    width: 320px;
    height: 480px; } }

.box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column; }

.box__area .box__bg_photo {
  background-image: url();
  background-size: cover;
  background-position: 50% 0%;
  background-repeat: no-repeat; }

.coverUnit-body h1 {
  background: #e64673, 0.8; }

.coverUnit-body h2 {
  background: #e64673, 0.8; }

.box__bg {
  background: rgba(230, 70, 115, 0.8); }

.box__area {
  height: 100vh;
  overflow-y: auto;
  -webkit-scroll-snap-points-y: repeat(100vh);
  -ms-scroll-snap-points-y: repeat(100vh);
  scroll-snap-points-y: repeat(100vh);
  -webkit-scroll-snap-type: mandatory;
  -ms-scroll-snap-type: mandatory;
  scroll-snap-type: mandatory; }

/******** 3-5-1.  coverUnit-head   ****/
/******** 3-5-2. coverUnit-body    ****/
/******** 3-5-3. coverUnit-foot    ****/
/*    3-6.  heroBotton
  * ------------------------------------------------------ */
/*    3-7.  heroFigure
  * ------------------------------------------------------ */
/*    3-8.  verticalSpace
  * ------------------------------------------------------ */  
.verticalMargin-t-lg {
    margin-top: 120px;
}
.verticalMargin-t-md {
    margin-top: 60px;
}
.verticalMargin-t-sm {
    margin-top: 30px;
}
.verticalMargin-t-xs {
    margin-top: 10px;
}
.verticalMargin-t-0 {
    margin-top: 0;
}
.verticalMargin-b-lg {
    margin-bottom: 120px;
}
.verticalMargin-b-md {
    margin-bottom: 60px;
}
.verticalMargin-b-sm {
    margin-bottom: 30px;
}
.verticalMargin-b-xs {
    margin-bottom: 10px;
}
.verticalMargin-b-0 {
    margin-bottom: 0;
}
.verticalPadding-t-lg {
    padding-top: 120px;
}
.verticalPadding-t-md {
    padding-top: 60px;
}
.verticalPadding-t-sm {
    padding-top: 30px;
}
.verticalPadding-t-xs {
    padding-top: 10px;
}
.verticalPadding-t-0 {
    padding-top: 0;
}
.verticalPadding-b-lg {
    padding-bottom: 120px;
}
.verticalPadding-b-md {
    padding-bottom: 60px;
}
.verticalPadding-b-sm {
    padding-bottom: 30px;
}
.verticalPadding-b-xs {
    padding-bottom: 10px;
}
.verticalPadding-b-0 {
    padding-bottom: 0;
}
@media only screen and (max-width:  501px) {
.verticalPadding-b-smss {padding-bottom: 30px;
}}

/*    3-9.  horizontalSpace
  * ------------------------------------------------------ */
.horizontalMargin-l-lg {
    margin-left: 120px;
}
.horizontalMargin-l-md {
    margin-left: 60px;
}
.horizontalMargin-l-sm {
    margin-left: 30px;
}
.horizontalMargin-l-xs {
    margin-left: 10px;
}
.horizontalMargin-l-ss {
    margin-left: 5px;
}
.horizontalMargin-l-0 {
    margin-left: 0;
}
.horizontalMargin-r-lg {
    margin-right: 120px;
}
.horizontalMargin-r-md {
    margin-right: 60px;
}
.horizontalMargin-r-sm {
    margin-right: 30px;
}
.horizontalMargin-r-xs {
    margin-right: 10px;
}
.horizontalMargin-r-ss {
    margin-right: 5px;
}
.horizontalMargin-r-0 {
    margin-right: 0;
}
.horizontalPadding-l-lg {
    padding-left: 120px;
}
.horizontalPadding-l-md {
    padding-left: 60px;
}
.horizontalPadding-l-sm {
    padding-left: 30px;
}
.horizontalPadding-l-xs {
    padding-left: 10px;
}
.horizontalPadding-l-ss {
    padding-left: 5px;
}
.horizontalMargin-l-0 {
    padding-left: 0;
}
.horizontalPadding-r-lg {
    padding-right: 120px;
}
.horizontalPadding-r-md {
    padding-right: 60px;
}
.horizontalPadding-r-sm {
    padding-right: 30px;
}
.horizontalPadding-r-xs {
    padding-right: 10px;
}
.horizontalPadding-r-ss {
    padding-right: 5px;
}
.horizontalPadding-r-0 {
    padding-right: 0;
}
@media only screen and (max-width:  501px) {
	.horizontalPadding-lr-minus15 {
    margin-right: -15px;
	margin-left: -15px;
}}



/*    3-10.  headingAccent
  * ------------------------------------------------------ */
/*    3-11.  buttonUnit
  * ------------------------------------------------------ */
/*    3-12.  formUnit
  * ------------------------------------------------------ */
input, textarea {
    background-color: #f6f6f6 !important;
    margin: 0;
}
input[type="text,email"] {
    background-color: #f6f6f6 !important;
    border: 0 none;
    height: 40px;
    left: 0;
    padding: 0 10px;
    position: absolute;
    top: 0;
    width: 200px;
}
.floating-label-form-group {
    border-bottom: 0 solid #eee;
    margin-bottom: 0;
    padding-bottom: 0.5em;
    position: relative;
}
.floating-label-form-group input, .floating-label-form-group textarea {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    border-radius: 0;
    box-shadow: none !important;
    font-size: 1.5em;
    padding-left: 0;
    padding-right: 0;
    position: relative;
    resize: none;
    z-index: 1;
}
.floating-label-form-group label {
    color: #252525;
    font-size: 15px;
    font-weight: normal;
}
.floating-label-form-group::not(:first-child) {
  padding-left: 14px;
  border-left: 0px solid #eee; }
.floating-label-form-group-with-value label {
    opacity: 1;
    top: 0;
}
.floating-label-form-group-with-focus label {
    color: #a94442;  /* フォームの上に表示されるガイドの文字色 */ 
}
form .row:first-child .floating-label-form-group {
    border-top: 0 solid #eee;
}
p#confirm-button {
    text-align: center;
}
p#confirm-button input {
    background: #5cb85c none repeat scroll 0 0 !important;
    border: medium none #5cb85c !important;
    color: #f6f6f6;
    display: block;
    width: 100%;
}
p#confirm-button input:hover {
    background: #449d44 none repeat scroll 0 0 !important;
    color: #dff0d8;
}
p#confirm-button input:active {
    background-color: #449d44;
    border-color: #398439;
    color: #f6f6f6;
}
/*    3-13.  fluidModal
  * ------------------------------------------------------ */
.fluidModal-item .fluidModal-link {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    position: relative;
}
.fluidModal-item .fluidModal-link .caption {
    background: #00c853 none repeat scroll 0 0;
    height: 100%;
    opacity: 0;
    position: absolute;
    width: 100%;
	    transition: all 0.5s ease 0s;
	-webkit-transition: all ease .5s;
 -moz-transition: all ease .5s;
}
.fluidModal-item .fluidModal-link .caption:hover {
    opacity: 1;
}
.fluidModal-item .fluidModal-link .caption .caption-content {
    color: #f6f6f6;
    height: auto;
    margin-top: 0;
    padding: 0 10px;
    position: absolute;
    text-align: left;
    top: 10px;
    width: 100%;
}
.fluidModal-item .fluidModal-link .caption .caption-content i {
    margin-top: -12px;
}
.fluidModal-item .fluidModal-link .caption .caption-content h3, .fluidModal-item .fluidModal-link .caption .caption-content h4 {
    margin: 0;
}
@media  print, screen and (min-width: 768px) {
.fluidModal-item {
    margin: 0;
}
}
.fluidModal-modal .modal-content {
    background-clip: border-box;
    border: 0 none;
    border-radius: 0;
    box-shadow: none;
    min-height: 100%;
    padding: 100px 0;
    text-align: center;
}
.fluidModal-modal .modal-content h2 {
    font-size: 3em;
    margin: 0;
}
.fluidModal-modal .modal-content img {
    margin-bottom: 30px;
}
.fluidModal-modal .modal-content .item-details {
    margin: 30px 0;
    text-align: left;
}
.fluidModal-modal .close-modal {
    background-color: transparent;
    cursor: pointer;
    height: 75px;
    position: absolute;
    right: 25px;
    top: 25px;
    width: 75px;
}
.fluidModal-modal .close-modal:hover {
    opacity: 0.3;
}
.fluidModal-modal .close-modal .lr {
    background-color: #2c3e50;
    height: 75px;
    margin-left: 35px;
	  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 1px;
    z-index: 1051;
}
.fluidModal-modal .close-modal .lr .rl {
    background-color: #2c3e50;
    height: 75px;
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
      transform: rotate(90deg);
    width: 1px;
    z-index: 1052;
}
.fluidModal-modal .modal-backdrop {
    display: none;
    opacity: 0;
}
.fluidModal-modal .modal-content {
    background-clip: border-box;
    border: 0 none;
    border-radius: 0;
    box-shadow: none;
    min-height: 100%;
    padding: 100px 0;
    text-align: center;
}
.fluidModal-modal .modal-content h2 {
    font-size: 3em;
    margin: 0;
}
.fluidModal-modal .modal-content img {
    margin-bottom: 30px;
}
.fluidModal-modal .modal-content .item-details {
    margin: 30px 0;
    text-align: left;
}
.fluidModal-modal .close-modal {
    background-color: transparent;
    cursor: pointer;
    height: 75px;
    position: absolute;
    right: 25px;
    top: 25px;
    width: 75px;
}
.fluidModal-modal .close-modal:hover {
    opacity: 0.3;
}
.fluidModal-modal .close-modal .lr {
    background-color: #2c3e50;
    height: 75px;
    margin-left: 35px;
	  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 1px;
    z-index: 1051;
}
.fluidModal-modal .close-modal .lr .rl {
    background-color: #2c3e50;
    height: 75px;
	  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    width: 1px;
    z-index: 1052;
}
.fluidModal-modal .modal-backdrop {
    display: none;
    opacity: 0;
}
/*    3-14.  shadowEffect
  * ------------------------------------------------------ */
.shadowEffect-0 {
    box-shadow: none !important;
}
.shadowEffect-1, nav, .card-panel, .card, .toast, .btn, .btn-large, .btn-floating, .dropdown-content, .collapsible, .side-nav {
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}
.shadowEffect-1-half, .btn:hover, .btn-large:hover, .btn-floating:hover {
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
}
.shadowEffect-2 {
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.shadowEffect-3 {
    box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19);
}
.shadowEffect-4, .modal {
    box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22), 0 25px 55px 0 rgba(0, 0, 0, 0.21);
}
.shadowEffect-5 {
    box-shadow: 0 27px 24px 0 rgba(0, 0, 0, 0.2), 0 40px 77px 0 rgba(0, 0, 0, 0.22);
}
/*    3-15. copyrightUnit
  * ------------------------------------------------------ */
.copyrightUnit {
    text-align: left;
}
@media print, screen and (min-width: 768px) {
.copyrightUnit {
    text-align: center;
}
}
/*    3-16. dividerUnit
  * ------------------------------------------------------ */
hr.dividerUnit {
    border-bottom: 1px solid #b7b7b7;
      -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
	box-sizing: content-box;
    display: block;
    height: 0;
    padding-bottom: 0;
}
._dividerUnit::after {
    background: #e5e5e5 none repeat scroll 0 0;
    content: "★";
    height: 1px;
    margin: 8px 0;
    width: 100%;
}
/*    3-17. imgCaptionUnit
  * ------------------------------------------------------ */
.imgCaptionUnit {
    line-height: 1.3;
    margin: 0;
}
/*    3-18. tableUnit
  * ------------------------------------------------------ */
.m-tableBorder-right {
    border-right: 1px solid #ddd;
}
.m-tableBorder-right-none {
    border-right: 0 none;
}
.m-tableBorder-bottom {
    border-bottom: 2px solid #ddd;
}
.nowrap {
    white-space: nowrap;
}
/*    3-98.  misc
  * ------------------------------------------------------ */
.headeigDec-Underline {
    border-bottom: 1px solid #b7b7b7;
    padding-bottom: 5px;
}
.listStyle-disc {
    list-style-type: disc;
}
.listStyle-leading-zero {
    list-style-type: decimal-leading-zero;
}
/*    3-99.  CSS Framework Customize
  * ------------------------------------------------------ */
@media print, screen and (min-width: 760px) and (max-width: 1024px) {
.hamburgerMenu {
    position: relative;
    top: -5px !important;
}
}
.eyeCatch {
    margin-left: -15px;
    margin-right: -15px;
}
/* =============================================================== *
   *  4.  STATE
   * =============================================================== */
/*    4-1.  is-navbarNavUnit-active
    * ------------------------------------------------------ */
.is-navbarNavUnit-active {
    border-bottom: 4px solid #ff5855;
}
/* =============================================================== *
    *  5.  THEME
    * =============================================================== */
/*    5-1.  GeneralColor (textLinkColor)
  * ------------------------------------------------------ */
p a:link, p a:visited {
    color: #0033cc;
    text-decoration: none;
}
p a:hover {
    color: #252525;
}
p a:active {
    background: #528bff none repeat scroll 0 0;
    color: #f6f6f6;
}
h1 a:link, h1 a:visited, h2 a:link, h2 a:visited, h3 a:link, h3 a:visited {
    color: #0033cc;
    font-weight: normal;
    text-decoration: none;
}
h1 a:hover, h2 a:hover, h3 a:hover {
    background: transparent none repeat scroll 0 0;
    color: #b8cfff;
}
.is-a-hover {
    background: transparent none repeat scroll 0 0;
    color: #f6f6f6 !important;
}
.is-a-active {
    background: transparent none repeat scroll 0 0;
    color: #f6f6f6 !important;
}
body {	
    background: #fff none repeat scroll 0 0;
    color: #252525;
}
.l-footeBelow {
    background: #f6f6f6 none repeat scroll 0 0;
}
.l-cover {
    background: #fff none repeat scroll 0 0;
    color: #333333;
}
section {
    background: #f6f6f6 none repeat scroll 0 0;
}
article section:nth-of-type(2n) {
    background: #f6f6f6 none repeat scroll 0 0;
}
_section div:nth-child(1) {
    background: transparent none repeat scroll 0 0;
}
section.archiveSection {
    background: #f1f0ee none repeat scroll 0 0;
}
article.archiveArticle {
    background: #f1f0ee none repeat scroll 0 0;
}
.l-footerAbove {
    background: #f6f6f6 none repeat scroll 0 0;
}
.scroll-top .btn {
    background: rgba(250, 225, 229, 0.9) none repeat scroll 0 0;
}
.scroll-top a:link, .scroll-top a:visited {
    color: #f6f6f6;
    font-weight: normal;
}
.scroll-top a:hover {
    background: white none repeat scroll 0 0;
    color: #f6f6f6;
}
.navListUnit a:link, .navListUnit a:visited {
    color: #0033cc;
    font-weight: normal;
}
.navbarNavUnit-local a:link, .navbarNavUnit-local a:visited {
    color: #0033cc;
    font-weight: normal;
}
.navbar-toggle {
    background: #000000 none repeat scroll 0 0;
}
.navbar-default .navbar-toggle {
    background: #000000 none repeat scroll 0 0;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background: rgba(114, 114, 114, 0.5) none repeat scroll 0 0;
}
.navbar-default .navbar-toggle .icon-bar {
    background: #727272 none repeat scroll 0 0;
}
/*    5-3.  moduleColor
  * ------------------------------------------------------ */
.strong {
    font-weight: 900;
}
.captionBox {
    background: #000000 none repeat scroll 0 0;
    color: #999999;
    padding: 10px;
}
.keyColor {
    background: #222222 none repeat scroll 0 0;
}
.keyColor40dark {
    background: #000000 none repeat scroll 0 0;
}
.keyColor20dark {
    background: #111111 none repeat scroll 0 0;
}
.keyColor20pale {
    background: white none repeat scroll 0 0;
}
.keyColor40pale {
    background: white none repeat scroll 0 0;
}
.keyColor60pale {
    background: white none repeat scroll 0 0;
}
.subColor {
    background: #555555 none repeat scroll 0 0;
}
.subColor40dark {
    background: #333333 none repeat scroll 0 0;
}
.subColor20dark {
    background: #444444 none repeat scroll 0 0;
}
.subColor20pale {
    background: #666666 none repeat scroll 0 0;
}
.subColor40pale {
    background: #777777 none repeat scroll 0 0;
}
.subColor60pale {
    background: #888888 none repeat scroll 0 0;
}
.accentColor {
    background: #528bff none repeat scroll 0 0;
}
.accentColor40dark {
    background: #003db8 none repeat scroll 0 0;
}
.accentColor20dark {
    background: #004deb none repeat scroll 0 0;
}
.accentColor20pale {
    background: #b8cfff none repeat scroll 0 0;
}
.accentColor40pale {
    background: #d2e0ff none repeat scroll 0 0;
}
.accentColor60pale {
    background: white none repeat scroll 0 0;
}
.gryColor {
    background: #f1f0ee none repeat scroll 0 0;
}
.gryColorTone {
    background: #dad7d2 none repeat scroll 0 0;
}
.gryColorTone2nd {
    background: #c3bfb6 none repeat scroll 0 0;
}
.gryColorTone3rd {
    background: #aca69a none repeat scroll 0 0;
}
.gryColorTone4th {
    background: #958d7e none repeat scroll 0 0;
}
.gryColorTone5th {
    background: #7b7465 none repeat scroll 0 0;
}
.wht {
    background: #f6f6f6 none repeat scroll 0 0;
}
.wht-text {
    color: #f6f6f6;
}
.blck-text {
    color: #757575;
}
.keyColor-text {
    color: #222222;
}
.keyColor20dark-text {
    color: #111111;
}
.keyColor40dark-text {
    color: #000000;
}
.subColor-text {
    color: #555555;
}
.subColor20dark-text {
    color: #666666;
}
.subColor40dark-text {
    color: #cccccc;
}
.accentColor-text {
    color: #528bff;
}
.accentColor20dark-text {
    color: #004deb;
}
.accentColor40dark-text {
    color: #003db8;
}
.gryColor-text {
    color: #f1f0ee;
}
.gryColorTone-text {
    color: #dad7d2;
}
.gryColorTone2nd-text {
    color: #c3bfb6;
}
.gryColorTone3rd-text {
    color: #aca69a;
}
.gryColorTone4th-text {
    color: #958d7e;
}
.gryColorTone5th-text {
    color: #7b7465;
}
.linkTxt {
	color: #0033cc;
	}
.navbar-default .navbar-nav li a {
	color: #0033cc;
	}
/*    5-5.  textSize
 * ------------------------------------------------------ */
.textSize-xl {
    font-size: 5rem;
    margin: 0;
    padding: 0;
}
.textSize-lg {
    font-size: 3rem;
    margin: 0;
    padding: 0;
}
.textSize-md {
    font-size: 2rem;
    margin: 0;
    padding: 0;
}
.textSize-sm {
    font-size: 1.5rem;
    font-weight: normal;
    margin: 0;
    padding: 0;
}
.textSize-xs {
    font-size: 1.1rem;
    font-weight: normal;
    margin: 0;
    padding: 0;
}
.textSize-xxs {
    font-size: 0.8rem;
    font-weight: normal;
    margin: 0;
    padding: 0;
}
.textSize-xxxs {
    font-size: 0.5rem;
    font-weight: normal;
    margin: 0;
    padding: 0;
}
@media print, screen and (min-width: 768px) {
.textSize-xxs {
    font-size: 0.6rem;
    margin: 0;
    padding: 0;
}
}
.small {
    font-size: 0.8rem;
}
/*    5-6.  misc
 * ------------------------------------------------------ */
#comment_area {
    background: rgba(255, 255, 255, 0.5) none repeat scroll 0 0;
    border-radius: 12px;
    line-height: 1.4em;
    margin-top: 1em;
    padding: 25px;
}
#comment_area h3#comments {
    font-size: 130%;
    margin: 0 0 0.7em;
}
#comment_area ol {
    list-style: outside none none;
}
#comment_area ol li {
    overflow: hidden;
}
#comment_area ol li.depth-1 {
    border: 1px dotted #f6f6f6;
    margin-bottom: 1em;
    padding: 12px;
}
#comment_area ol li ul.children {
    margin-left: 10%;
}
#comment_area ol li ul.children li {
    border-top: 1px dotted #f6f6f6;
    margin-top: 1em;
    padding-top: 12px;
}
img.avatar {
    float: left;
    margin-right: 8px;
}
span.says {
    display: none;
}
cite.fn {
    font-size: 90%;
}
div.comment-meta {
    font-size: 80%;
}
div.comment-meta::after {
    clear: both;
    content: "";
    display: block;
    height: 0;
    visibility: hidden;
}
.comment-body p {
    background: #f6f6f6 none repeat scroll 0 0;
    border-radius: 12px;
    color: #05c6fe;
    font-size: 90%;
    margin: 0.8em 0 0.5em;
    padding: 0.5em 1em;
}
div.reply {
    margin-bottom: 0.2em;
}
div.reply::after {
    clear: both;
    content: "";
    display: block;
    height: 0;
    visibility: hidden;
}
div.reply a {
    background: #05c6fe none repeat scroll 0 0;
    border-radius: 8px;
    display: block;
    float: right;
    font-size: 80%;
    line-height: 1em;
    padding: 0.3em 1em;
}
div.reply a:hover {
    background: #f6f6f6 none repeat scroll 0 0;
    text-decoration: none;
}
/*Comment Form*/
#respond {
    background: rgba(255, 255, 255, 0.4) none repeat scroll 0 0;
    border-radius: 9px;
    padding: 1em;
}
#respond h3#reply-title {
    color: #2d1497;
    font-size: 130%;
    margin: 0 0 0.7em;
}
#respond h3#reply-title small a {
    font-size: 70%;
    margin-left: 1em;
    text-decoration: underline;
}
/*コメントをキャンセルの文字*/
#respond p {
    margin-bottom: 0.5em;
}
#respond p.commentNotesBefore, #respond p.commentNotesAfter {
    font-size: 80%;
}
#respond p.form-submit {
    margin-bottom: 0;
}
/*form element*/
input#author, input#email, textarea#comment {
    border: medium none;
    border-radius: 12px;
    color: #05c6fe;
    font-size: 14px;
    margin-top: 0;
    padding: 7px 12px;
    width: 95%;
}
textarea#comment {
    line-height: 1.6em;
}
input#submit {
    background: #05c6fe none repeat scroll 0 0;
    border-radius: 18px;
    border-style: none;
    color: #252525;
    cursor: pointer;
    font-size: 110%;
    margin: 0;
    padding: 5px 1em;
}
input#submit:hover {
    background: #2d1497 none repeat scroll 0 0;
}
/*   Addition by myselfここより自己追加分
 * ------------------------------------------------------ */
.bgfff {
    background: #ffffff none repeat scroll 0 0;}

 
center {
	display: block;
	margin:auto;;
}
center img {
	display: block;
	margin:auto;	
	text-align:center;
}

height100px{
	 height:1000em; 
	 }
	 
.verticalMargin-b-Minuslg {
    margin-bottom: -120px;
	}
	@media only screen and  (max-width:  501px) {
.img-responsive80px {
  display: block;
  height: auto;
  max-width: 80px;
}
 .h2 h3 {
    font-size: 1rem;
}
}

@media print, screen and (min-width: 501px) {
	.img-responsive80px  {
	  display: block;
  height: auto;
  max-width: 140px;
}}

.photowidth{width: 15%;
}
@media only screen and (max-width: 769px) {
	.photowidth{width: 30%;
}}

div.contentsbox
      {	border-style: solid;
         border-width: 1px;
         border-color: #000080;
      }

.lineHight3 {line-height: 3rem;}
.lineHight2 {line-height: 2rem;}
.lineHight1 {line-height: 1rem;}

.verticalMargin-t-1rem{margin-top: 1rem
	;}
.verticalMargin-t-2rem{margin-top: 2rem
	;}
.verticalMargin-t-2remstatic{margin-top: 2rem
	;}
.verticalMargin-t-3rem{margin-top: 3rem
	;}
.verticalMargin-t-3remres{margin-top: 3rem
	;}
.verticalMargin-t-4rem{margin-top: 4rem
	;}
.verticalMargin-t-5rem{margin-top: 5rem
	;}

.verticalMargin-b-1rem{margin-bottom: 1rem
	;}
.verticalMargin-b-2rem{margin-bottom: 2rem
	;}
.verticalMargin-b-3rem{margin-bottom: 3rem
	;}
.verticalMargin-b-4rem{margin-bottom: 4rem
	;}
.verticalMargin-b-5rem{margin-bottom: 5rem
	;}

	
.verticalPadding-t-minus5 {
    padding-top: -5rem;
}
.verticalPadding-t-minus4 {
    padding-top: -4rem;
}
.verticalPadding-t-minus3 {
    padding-top: -3rem;
}
.verticalPadding-t-minus2 {
    padding-top: -2rem;
}
.verticalPadding-t-minus1 {
    padding-top: -1rem;
}
.verticalPadding-t-1rem {
    padding-top: 1rem;
}
.verticalPadding-t-2rem {
    padding-top: 2rem;
}
.verticalPadding-t-3rem {
    padding-top: 3rem;
}
.verticalPadding-t-4rem {
    padding-top: 4rem;
}
.verticalPadding-t-5rem {
    padding-top: 5rem;
}
.verticalPadding-t-50px {
    padding-top: 50px;
}
.verticalPadding-b-minus5 {
    padding-bottom: -5rem;
}
.verticalPadding-b-minus4 {
    padding-bottom: -4rem;
}
.verticalPadding-b-minus3 {
    padding-bottom: -3rem;
}
.verticalPadding-b-minus2 {
    padding-bottom: -2rem;
}
.verticalPadding-b-minus1 {
    padding-bottom: -1rem;
}
.verticalPadding-b-1rem {
    padding-bottom: 1rem;
}
.verticalPadding-b-2rem {
    padding-bottom: 2rem;
}
.verticalPadding-b-3rem {
    padding-bottom: 3rem;
}
.verticalPadding-b-4rem {
    padding-bottom: 4rem;
}
.verticalPadding-b-5rem {padding-bottom: 5rem;
}
.verticalPadding-tb-64 {padding: 64px 15px;
}
@media screen and (max-width: 1024px) {
.verticalPadding-t-2rem {
    padding-top: 2rem;
}
.verticalMargin-t-2rem{margin-top: 0
	;}
	.verticalPadding-b-2rem {
    padding-bottom: 0;
	}}
img.max490image50 {width: 10%;
					height: 10%;
}
@media only screen and (max-width: 769px) {
.verticalMargin-t-3remres{margin-top: 1.5rem
	;}

}
@media only screen and (max-width:  501px) {
.verticalMargin-t-1remxsonly{margin-top: 1rem
	;}
.verticalMargin-b-1remxsonly{margin-bottom: 1rem
	;}
.max490widepadding {padding: 0rem 2rem;}
img.max490image50 {width: 30%;
					height: 30%;
}
.verticalMargin-t-3remres{margin-top: 1rem
	;}
}



.movieWraper {
    position: relative;
    width: calc(100% - 10px);
    margin: 0 auto;
}

.iframeWrap{
	width: 100%;
    height: 0;
    padding-bottom: 73.5%;
}

iframe {
    position: absolute;
    top: 0;
    left: 0;
}
 /* 個人的テキストサイズ */
.txt1rem {font-size:1rem; margin: 0;padding: 0; line-height:150%;}
.txt1remss {font-size:1rem; margin: 0;padding: 0; line-height:150%;}
.txt1remss120 {font-size:1rem; margin: 0;padding: 0; line-height:100%;}
.txt1_2rem {font-size: 1.2rem;  margin: 0;padding: 0;line-height:150%;}
.txt1_5rem {font-size: 1.5rem;  margin: 0;padding: 0;line-height:150%;}
.txt1_7rem {font-size: 1.7rem;  margin: 0;padding: 0; line-height:150%;}
.txt2rem {font-size: 2rem;  margin: 0;padding: 0;line-height:150%;}
.txt2remss {font-size: 2rem;  margin: 0;padding: 0;line-height:150%;}
.txt2_2rem {font-size: 2.2rem;  margin: 0;padding: 0;line-height:150%;}
.txt2_5rem {font-size: 2.5rem;  margin: 0;padding: 0;line-height:150%;}
.txt2_7rem {font-size: 2.7rem;  margin: 0;padding: 0;line-height:150%;}
.txt3rem {font-size: 3rem;  margin: 0;padding: 0;line-height:150%;}
.txt3remss {font-size: 3rem;  margin: 0;padding: 0;line-height:150%;}
.txt3_2rem {font-size: 3.2rem;  margin: 0;padding: 0;}
.txt3_5rem {font-size: 3.5rem;  margin: 0;padding: 0;}
.txt3_7rem {font-size: 3.7rem;  margin: 0;padding: 0;}
.txt4rem {font-size: 4rem;  margin: 0;padding: 0;}
.txt4_2rem {font-size: 4.2rem;  margin: 0;padding: 0;}
.txt4_5rem {font-size: 4.5rem;  margin: 0;padding: 0;}
.txt4_7rem {font-size: 4.7rem;  margin: 0;padding: 0;}
.txt5rem {font-size: 5rem;  margin: 0;padding: 0;}
.txt5_2rem {font-size: 5.2rem;  margin: 0;padding: 0;}
.txt5_5rem {font-size: 5.5rem;  margin: 0;padding: 0;}
.txt5_7rem {font-size: 5.7rem;  margin: 0;padding: 0;}
.txt6rem {font-size: 6rem;  margin: 0;padding: 0;}
.txt0_2rem {font-size: 0.2rem;  margin: 0;padding: 0;}
.txt0_5rem {font-size: 0.5rem;  margin: 0;padding: 0;}
@media only screen and (max-width:  501px) {
.txt2_5rem {font-size: 1.7rem;  margin: 0;padding: 0;}
.txt2rem {font-size: 1.6rem;  margin: 0;padding: 0;}
.txt1_7rem {font-size: 1.35rem;  margin: 0;padding: 0;}
.txt1_5rem {font-size: 1.1rem;  margin: 0;padding: 0;}
.txt3rem {font-size: 1.5rem;  margin: 0;padding: 0;line-height:150%;}
.txt3remss {font-size: 1.2rem;  margin: 0;padding: 0;line-height:150%;}
}
@media only screen and (max-width:  769px) {
.txt1rem {font-size:0.85rem; margin: 0;padding: 0; }
.txt1remss120 {font-size:0.8rem; margin: 0;padding: 0; line-height:100%;}
.txt1_5rem {font-size: 1rem;  margin: 0;padding: 0;}
.txt3rem {font-size: 1.75rem;  margin: 0;padding: 0;line-height:150%;}
.txt3remss {font-size: 1.1rem;  margin: 0;padding: 0;line-height:150%;}

}
@media screen and (max-width: 1024px) {
.txt2remss {font-size: 1rem;  margin: 0;padding: 0;}
}
.zff0066-text { color: #ff0066;}
.z990033-text { color: #990033;}
.z333399-text { color: #333399;}
.z3366cc-text { color: #3366cc;}
.z66ff00-text { color: #66ff00;}
.zff6600-text { color: #ff6600;}
.ffffff-text { color: #ffffff;}
.FFE300-text { color: #FFE300;}
.D45463-text { color: #D45463;}

@media only screen and (max-width: 501px) {
h1 {font-size: 1.5rem;
padding-bottom: -1rem;
 }
 .lineHight3 {line-height: 2rem;} 
 }
	
@media screen and (max-width: 1024px) {
h3{	font-size: 1rem;
}}

.text-center2{ text-align: center;}
@media only screen and (max-width: 769px) {
.text-center2{ text-align: left;
}}

@media print, screen and (min-width: 768px) {
.text-centerToLeft  {text-align: center;
}}
@media screen and (max-width: 1024px) {
.text-centerToLeft {text-align: left;
}}

@media only screen and (max-width:  501px) {
.flowSubtitle {
    font-size: 1.4rem;
    font-weight: 700;
	color: #d45664;
	line-height:150%;
}}
.flowSubtitle {
    font-size: 2rem;
    font-weight: 700;
	color: #d45664;
	line-height:150%;
}

    /* html,bodyタグの設定 */
    html, body{
        margin: 0;         /* 余白の削除 */
        padding: 0;        /* 余白の削除 */
        width:100%;
        height:100%;
    }
	    /* ヘッダーの固定 */
    div#header-fixed
    {
        position: fixed;            /* ヘッダーの固定 */
        top: 0px;                   /* 位置(上0px) */
        left: 0px;                  /* 位置(右0px) */
        width: 100%;                /* 横幅100%　*/
        height: 140px;              /* 縦幅140px */
    }
     
     
    div#header-bk { 
    	background-color:#D45463;     /* 背景色(ピンク) */
    	padding:10px 3rem;       /* 上10px、下 remをあける */
    	height:60px;              /* 縦の高さpx */
    	width:100%;                /* 横の幅を100% */
    }
     
     
/* フッターの固定 */
div#footer-fixed
{
    position: fixed;            /* フッターの固定 */
    bottom: 0px;                /* 位置(下0px) */
    left: 0px;                  /* 位置(左0px) */
    width: 100%;                /* 横幅100%　*/
    height: 140px;              /* 縦幅140px */
}
 
div#footer-bk
{
	background-color:#333;     /* 背景色(黒) */
	padding:10px 0 20px;       /* 上10px、下20pxをあける */
	height:110px;              /* 縦の高さ140px */
	width:100%;                /* 横の幅を100% */
}

/* 個人的調整 */
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #0033cc;
  background-color: #D45463;
}
 
div#footer { 
	border: 5px solid #333;    /* 表示領域を白枠で囲う */
	height: 100%;              /* 縦の表示領域はheader-bkと同じ */
	width: 960px;              /* 横の幅970px */
	margin: auto;              /* 中央揃え */
	}
	/* ボディの定義 */
div#body-bk{
    padding:3rem 0 3rem 0;    /* 上下に160pxを余白を取る */
}
div#bodylp1{
    width:960px;
    margin:auto;
}
@media only screen and (max-width: 501px) {
lp1header{margin-top: 30rem;
}}
.bgD45463{background: #D45463 none repeat scroll 0 0;
}
.bgffe5ff{background: #ffe5ff none repeat scroll 0 0;
}

p .left {
  float: left;
  margin-right: 1rem;
  margin-bottom: 1rem;
}
@media only screen and (max-width: 501px) {
.navbar-fixed-top,
.navbar-fixed-bottom {
  right: 0;
  left: 0;
      z-index: 2;
}}
.navbar-fixed-top2 {
	position: fixed;
  right: 0%;
  left: 0%;
   top: 0;
   z-index: 1030;}
.boxsize {box-sizing:content-box;}
.subtitleback { 
padding: .5em .75em;
 background-color: #D45463;
 border-radius: 6px;
 margin-right: auto;
 margin-left: auto;
}
.subtitleback, x:-moz-any-link  {padding: .6em .75em .4em .75em; 
}
.subtitlebackbk { 
padding: .5em .75em;
 background-color: #252525;
 border-radius: 6px;
 margin-right: auto;
 margin-left: auto;
}
.subtitlebackbk, x:-moz-any-link  {padding: .6em .75em .4em .75em; 
}

 /* ふきだし */
.fbox {
	 position: relative;
    display:inline-block;
    padding:10px ;
    text-align:left;
    background-color:#ffffff;
    border:6px solid #ffffff;
    margin: 5px 5px 6px 5px;
    border-radius: 7px ;
    box-shadow:0px 0px 0px 0px  #ffffff ;
}
.fbox:after, .fbox:before {
    content: "";
    position: absolute;
    height: 0;
    width: 0;
}
.fbox:after {
    top: 98%;
    left: 8px;
    border: 6px solid transparent;
    border-top: 6px solid #ffffff; /*10px*/
}
.fbox:before {
    top: 100%;
    left: 2px; 
    border: 12px solid transparent;
    border-top: 14px solid #ffffff; /*13px*/ 
	}
	 /* ふきだし色つき */
	 .fboxY {
	 position: relative;
    display:inline-block;
    padding:10px ;
    text-align:left;
    background-color:#ffffcc;
    border:6px solid #ffffcc;
    margin: 5px 5px 6px 5px;
    border-radius: 7px ;
    box-shadow:0px 0px 0px 0px  #ffffcc ;
}
.fboxY:after, .fbox:before {
    content: "";
    position: absolute;
    height: 0;
    width: 0;
}
.fboxY:after {
    top: 98%;
    left: 8px;
    border: 6px solid transparent;
    border-top: 6px solid #ffffcc; /*10px*/
}
.fboxY:before {
    top: 100%;
    left: 2px; 
    border: 12px solid transparent;
    border-top: 14px solid #ffffcc; /*13px*/ 
	}
	 /* カコミ*/
	 .lineBox {
		 display:inline-block;
    padding:10px ;
	border:2px solid #D45463;
    margin: 5px auto ;
    border-radius: 7px ;
	 }
	 /* ふきだし色つき2 */
	 .fboxY11 {
	 position: relative;
    display:inline-block;
    padding:10px ;
    text-align:left;
    background-color:#ffff11;
    border:6px solid #ffff11;
    margin: 5px 5px 6px 5px;
    border-radius: 7px ;
    box-shadow:0px 0px 0px 0px  #ffff11 ;
}
.fboxY11:after, .fbox:before {
    content: "";
    position: absolute;
    height: 0;
    width: 0;
}
.fboxY11:after {
    top: 98%;
    left: 8px;
    border: 6px solid transparent;
    border-top: 6px solid #ffff11; /*10px*/
}
.fboxY11:before {
    top: 100%;
    left: 2px; 
    border: 12px solid transparent;
    border-top: 14px solid #ffff11; /*13px*/ 
	}
	 /* 罫線 */
.boderbottom {
	border-bottom: 1px solid #252525;
	padding-bottom: 15px; /* 内容と線との間隔量 */
	}
.bar1 {
  display: block;
  width: 100%;
  height: 2px;
  background-color: #252525;
  border: 0;  /*デフォルトデザインでは線がある場合があるので、消しておく。*/
}
.border {  
	margin: 30px 0;
	padding: 10px;
	border: 1px solid #252525;
	}

/*Q&Aページ用*/
	
#QandA {
	margin-right: auto;
	margin-left: auto;
}
#QandA h2 {
	font-size: 1.5rem;
	background-color: #FCF;
	height: 2.5rem;
	line-height: 2.5rem;
	vertical-align: middle;
	padding-left: 20px;
	color: #F00;
}
#QandA h1 {
	font-size: 2.2rem;
	color: #333;
}
@media only screen and (max-width: 769px) {
#QandA h1 {
	font-size: 1.2rem;
}
#QandA h2 {
	font-size: 1rem;
	height: 150%;
	line-height: 150%;
}}
/******************************

 ソーシャルエリア全体を囲む要素
 * 他のコンテンツと距離を取りたい場合は[margin]を設定して下さい

******************************/
.social-area-syncer {
	width: 100% ;
	min-height: 190px ;
	background: #F6F6F6 ;	/* 背景色 */
	padding: 1.5em 0 ;
}

/* デスクトップPCでは高さを拡張する */
@media print, screen and (min-width:480px) {
	.social-area-syncer {
		min-height: 119px ;
	}}


/******************************

 [ul]要素

******************************/
/* スマホ */
ul.social-button-syncer {
	width: 238px ;
	margin: 24px auto ;
	padding: 0 ;
	border: none ;
	list-style-type: none ;
}

/* デスクトップ */
@media print, screen and (min-width:480px) {
	ul.social-button-syncer {
		width: 415px ;
	}}


/******************************

 [li]要素

******************************/
ul.social-button-syncer li {
	float: left ;
	text-align: center ;
	height: 71px ;
	margin: 0 8px ;
	padding:0 ;
}


/******************************

 各種ボタン

******************************/
/* [Twitter] */
.sc-tw {
	width: 71px ;
}

/* [Facebook] */
.sc-fb {
	z-index: 99 ;
	width: 69px ;
}

/* [LINE] */
.sc-li {
	width: 50px ;
}

.sc-li-img {
	border: none ;
	margin: 0 auto ;
	padding:0 ;
	width: 36px ;
	height: 60px ;
}

.btn-success {
    background-color: #fff;
    border-color: #fff;
    color: #0033cc;
}

/* デスクトップPCではLINEボタンを表示しない */
@media print, screen and (min-width:480px) {
	.sc-li {
		display: none ;
	}}
/* 仕切り点線 */	
hr.style-dot {
    border: 0;
    border-bottom: 1px dashed #ccc;
    background: #999;
}

/* 30%画像縮小 */	
.w30h30 {
width: 30%;
height: 30%;
}
.w73 {
width: 73%;
}
/* 背景 */	
.plate {
	border-radius:1rem;
background-color:#FFcc00;

}
.platePadding1
{
	border-radius: 1rem;
	background-color: #FFcc00;
	padding: 0 20px;
}
.platePaddingBottom
{
	border-radius: 1rem;
	background-color: #FFcc00;
	margin: 0 0 20px ;
	padding: 0 20px;
}
.lineFrame {
	border-radius: 1rem;
	border: 1px solid #FFCC00;
}
.imgbox {
	display: block;
	margin-bottom: 1rem;
	}