@charset "utf-8";


#container {}

.bgbox_t {
    background-image: url(/bridal/concept/images/bg.jpg);
}

.bgpdo_c01{
    padding: 0 0 110px 0;
}
.bgpdo_c02,
.bgpdo_c03,
.bgpdo_c04 {
    padding: 110px 0;
}
#container h2.pagetitle{
  margin: 80px auto 50px auto;
}
.tablehis{margin-top: 20px;margin-bottom: 60px;}
.tablehis th,.tablehis td{padding: 10px;border-bottom: 1px dotted #cccccc;}
.tablehis th{vertical-align: top;}

.concept_txt02{
text-align: center;
}

.bgimages_02{
background: url(/bridal/concept/images/ph02.png) no-repeat left center  ;
padding: 15px 0;
width: 100%;
}
.btnconcept a{position: relative;display: block;padding: 5px;text-align: center;width: 90%;border: 1px solid #efbb2c;color: #c29313;margin: 20px auto 10px auto;}
.btnconcept.fairlink a{background-color: #f4ddc5;}
.btnconcept a:link{color: #c29313 !important;text-decoration: none;}
.btnconcept a:hover{background-color:#c29313 ;color: #fff !important;text-decoration: none;}
.btnconcept a span{
display: inline-block;
    padding-left: 0px;
}
.btnconcept a span::before {
    content: '';
    width: 10px;
    height: 10px;
    border: 0px;
    border-top: solid 1px #58321c;
    border-right: solid 1px #58321c;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    top: 50%;
    right: 15px;
    margin-top: -5px;
}
.btnconcept a:hover span::before {
    border-top: solid 1px #fff;
    border-right: solid 1px #fff;
}



.bgbgffekfe{}

.box.shadow_box.init_invisible div{position: relative;padding: 20px;/*border: solid 2px #c29313;border-radius: 3px 0 3px 0;*/}
/*.box.shadow_box.init_invisible div:before,.box.shadow_box.init_invisible div:after{content: '';position: absolute;width:10px;height: 10px;border: solid 2px #c29313;border-radius: 50%;}
.box.shadow_box.init_invisible div:after {top:-12px;left:-12px;}
.box.shadow_box.init_invisible div:before {bottom:-12px;right:-12px;}*/

.box.shadow_box.init_invisible div{
width: 100%;background-color: rgba(255,255,255,0.8);padding: 20px;color: #000;}
.box.shadow_box.init_invisible div{
	position: relative;
}

.box.shadow_box.init_invisible div:before{
  content: '';/*何も入れない*/
  display: inline-block;/*忘れずに！*/
  width: 50px;/*画像の幅*/
  height: 50px;/*画像の高さ*/
  background-image: url("/bridal/common/images/left_w.png");
  background-size: contain;
  vertical-align: middle;
	position: absolute;
	top: 5px;
	left: 5px;
}
.box.shadow_box.init_invisible div:after{
  content: '';/*何も入れない*/
  display: inline-block;/*忘れずに！*/
  width: 50px;/*画像の幅*/
  height: 50px;/*画像の高さ*/
  background-image: url("/bridal/common/images/right_w.png");
  background-size: contain;
  vertical-align: middle;
	position: absolute;
	bottom: 5px;
	right: 5px;
}
.histext{
  font-size: 1.6rem;
}


/*
.box.shadow_box.init_invisible div:before{
	content: '◯◯';
	color: #fff;
	font-size: 30px;
	font-weight: bold; 
	position: absolute;
	top: -10px;
	left: -15px;
	transform: rotate(20deg);
	-moz-transform: rotate(20deg);
	-webkit-transform: rotate(20deg); 
	-o-transform: rotate(20deg);
	text-shadow:  0 0 8px #e0cd7b, 0 0 6px #e0cd7b, 0 0 4px #e0cd7b, 0 0 2px #e0cd7b, 0 0 0.5px #e0cd7b;
}
.box.shadow_box.init_invisible div:after{
	content: '◯◯';
	color: #fff;
	font-size: 30px;
	font-weight: bold; 
	position: absolute;
	bottom: -15px;
	right: -15px;
	transform: rotate(20deg);
	-moz-transform: rotate(20deg);
	-webkit-transform: rotate(20deg); 
	-o-transform: rotate(20deg);
	text-shadow:  0 0 8px #e0cd7b, 0 0 6px #e0cd7b, 0 0 4px #e0cd7b, 0 0 2px #e0cd7b, 0 0 0.5px #e0cd7b;
}
*/
@media screen and (min-width: 769px) {

#header nav ul li.nac10 a:before {position: absolute;bottom: -3px;left: calc(50% - 15px);width: 30px;height: 2px;content: '';border-radius: 3px;background: #143d6c;}
.bgbgffekfe .ph{width: 100%;}
.bgbgffekfe .ph img{width: 100%;height: auto;}
.box.shadow_box.init_invisible{width: 48%;margin-left: -50%;box-shadow: 0 0 8px #7c7c7c;}
/*
.bgbgffekfe{position: relative;}
.box.shadow_box.init_invisible{width: 40%;z-index: 10;position: absolute;}

.concept01 .box.shadow_box.init_invisible{top: 40%;right: 10%;}
.concept02 .box.shadow_box.init_invisible{top: 50%;right: 10%;}
.concept03 .box.shadow_box.init_invisible{top: 50%;right: 10%;}
.concept04 .box.shadow_box.init_invisible{top: 50%;right: 10%;}
.bgbgffekfe.concept02 .ph{}
*/
.bgbgffekfe{display: -webkit-flex;display: flex;-webkit-align-items: center;
    align-items: center;width: 100%;}
.concept01 .box.shadow_box.init_invisible{}
.concept01{}

.concept02 div:nth-of-type(2),.concept04 div:nth-of-type(2) {-webkit-order: -1;order: -1;}
.concept02 .box.shadow_box.init_invisible,.concept04 .box.shadow_box.init_invisible{margin-left: 0 !important;margin-right: -50% !important;}


.concept02 .box.shadow_box.init_invisible{}
.concept02,.concept04{-webkit-justify-content: flex-end;justify-content: flex-end;}

.tablehis th{width: 20%;}


}
.init_invisible .h3555{margin: 0 0 10px 0!important;}


   .wrap {
      overflow: hidden;
   }
.concept01   {
      margin-top: 80px;
   }   
   

/* スタート時のスタイル */

.concept01.delighter.started,
.concept02.delighter.started,
.concept03.delighter.started,
.concept04.delighter.started,
.history.delighter.started    {
      transform: none;
      opacity: 1;
   }

/* 基本のスタイル */
   .concept01.delighter,
   .concept03.delighter {
      transition: all .7s ease-out;
      transform: translateX(-100%);
      opacity: 0;
      overflow: hidden;
   }

   .history.delighter {
      transition: all 1.0s ease-out;
      opacity: 0;
   }
      
   .concept02.delighter,
   .concept04.delighter {
      transition: all .7s ease-out;
      transform: translateX(100%);
      opacity: 0;
      overflow: hidden;
   }



/* エンド時のスタイル */
   .concept01.delighter.started.ended,
      .concept02.delighter.started.ended,
         .concept03.delighter.started.ended,
   .concept04.delighter.started.ended {
      
   }
.history.delighter.ended    {

   }


@media screen and (max-width: 768px) {
.concept01   {
      margin-top: 30px;
   }   
.box.shadow_box.init_invisible div{
width: 100%;background-color: rgba(255,255,255,0.8);padding: 20px;color: #000;}
#container h2.pagetitle {
    letter-spacing: -0.05em;
    text-align: center;
}
#container h3.h3555 {
    font-size: 1.6rem;
    text-align: center;
}
.bgpdo_c01 {
    padding: 0 0 50px 0;
}
.bgpdo_c02,
.bgpdo_c03,
.bgpdo_c04 {
    padding: 50px 0;
}
#container h2.pagetitle{
  margin: 40px auto 20px auto;
}
.tablehis,.tablehis tbody,.tablehis thead,.tablehis tr,.tablehis td,.tablehis th{display: block;}
.tablehis th{background-color: #ffffff;}
.tablehis td{margin-bottom: 20px;}
.histext{
  font-size: 1.2rem;
  text-align: center;
}
.concept_txt02{
letter-spacing: 0.005em;
}
}

