/*========================================

　●　ご挨拶
　●　ピックアップ
　●　情報エリア

========================================*/


/*========================================
　●　ご挨拶
========================================*/
.welcome{
 /*height: 520px;*/
 color: #fff;
 background: url("../images/p01top/welcome_bg.jpg") no-repeat center top / auto;
	background-size: cover;
}

.welcome--inner{ padding: 80px 10px 80px 10px;}

.welcome h2{
 margin-bottom: 45px;
 font-size: 34px;
 text-align: center;
 text-shadow:
   rgb(68, 36, 93,0.3) 1px 1px 5px, rgb(68, 36, 93,0.3) -1px 1px 5px,
   rgb(68, 36, 93,0.3) 1px -1px 5px,rgb(68, 36, 93,0.3) -1px -1px 5px;
}

.welcome p{
 font-size: 18px;
 line-height: 42px;
 text-align: center;
 text-shadow:
   rgb(68, 36, 93,0.3) 1px 1px 5px, rgb(68, 36, 93,0.3) -1px 1px 5px,
   rgb(68, 36, 93,0.3) 1px -1px 5px,rgb(68, 36, 93,0.3) -1px -1px 5px;
}

/*============================== ■ max-width 1087 */
@media screen and (max-width: 1087px){}/*----- media -----*/

/*============================== ■ max-width 767 */
@media screen and (max-width: 767px){
.welcome{ height: auto;}

.welcome--inner{ padding: 80px 20px 96px 20px;}

}/*----- media -----*/

/*============================== ■ max-width 520 */
@media screen and (max-width: 520px){
.welcome{
 background: url("../images/p01top/welcome_bg.jpg") no-repeat center top / cover;
}

.welcome--inner{ padding: 60px 10px 76px 10px;}

.welcome p{ text-align: left;}

}/*----- media -----*/

/*========================================
　●　ピックアップ
========================================*/
/*------------------------------ 全体設定 */
.pickupWhole{
 overflow: hidden;
 width: 100%;
 max-width: 1470px;
 margin-bottom: 40px;
 margin-left: auto;
 margin-right: auto;
 padding-top: 48px;
}

/*------------------------------ pickup共通設定 */
.pickupBase{
 display: flex;
  align-items: center;
 margin-bottom: 40px;
}

.pickupBase > figure{  position: relative; max-width: 930px;}
.pickupBase > figure img.pickupBaseImage{ width: 100%;}

.pickupBase--deco01{
 position: absolute; top: -46px; left: 4px;
 width: 218px;
}

.pickupBase--deco02{
 position: absolute; top: -46px; right: 4px;
 width: 218px;
}

.pickupBaseText{
 width: 36.8%;
 max-width: 540px;
 padding-left: 10px;
 padding-right: 10px;
}

/*----------*/
.pickupBaseText h2{
 width: 100%;
 max-width: 480px;
 margin-bottom: 16px;
 margin-left: auto;
 margin-right: auto;
 padding-bottom: 8px;
 color: #44245d;
 font-size: 30px;
 line-height: 1.4;
 text-align: center;
 border-bottom: 1px solid #44245d;
}

.pickupBaseText p{
 margin-bottom: 48px;
 line-height: 42px;
 text-align: center;
}

/*-----*/
a.pickupBaseLink{
 display: flex;
  align-items: center;
  justify-content: center;
 width: 100%;
 max-width: 300px;
 height: 56px;
 margin: 0 auto;
 color: #fff;
 font-size: 19px;
 text-decoration: none;
 transition: all 0.3s ease-out;
}

a.pickupBaseLink .arrow{
 position: absolute; top: 14px; right: 13px;
 transition: all 0.3s ease-out;
}
a.pickupBaseLink:hover .arrow{ position: absolute; top: 14px; right: 9px;}

a.pickupBaseLink:link  { color: #fff;}
a.pickupBaseLinkvisited{ color: #fff;}
a.pickupBaseLink:hover { color: #fff;}

a.pickupBaseLink.button_ef > span.ef,
a.pickupBaseLink.button_ef > span.ef:after{ background: #44245d;}
a.pickupBaseLink.button_ef:hover > span.ef:after{ background: #778b26;}

/*------------------------------ pickup個別設定 */
.pickup01.pickupBase,
.pickup03.pickupBase{  flex-direction: row-reverse;}

.pickup03 .pickupBaseText h2{
 padding-bottom: 11px;
 font-size: 27px;
 line-height: 1.0;
}
.pickup03 .pickupBaseText h2 > span{ font-size: 20px;}

.pickup01 .pickupBaseText h2 br,
.pickup03 .pickupBaseText h2 br{ display: none;}


.pickupBaseText p br.u-br0101{ display: block;}

/*============================== □ max-width xxxx */
@media screen and (max-width: 1370px){
/*------------------------------ pickup共通設定 */
/*----------*/
.pickupBase h2{
 font-size: 28px;
}

.pickupBaseText p{
 line-height: 2.2;
 text-align: left;
}

/*------------------------------ pickup個別設定 */
.pickup01 .pickupBaseText h2 br,
.pickup03 .pickupBaseText h2 br{ display: block;}

.pickupBaseText p br.u-br0101{ display: none;}

}/*----- media -----*/

/*============================== ■ max-width 1087 */
@media screen and (max-width: 1087px){
/*------------------------------ pickup共通設定 */
.pickupBase{
 display: flex;
  align-items: center;
  flex-direction: column !important;
}

.pickupBase--deco01{
 position: absolute; top: -46px; left: 4px;
 width: calc(218px * 0.8);
}

.pickupBase--deco02{
 position: absolute; top: -46px; right: 4px;
 width: calc(218px * 0.8);
}

.pickupBaseText{
 width: 100%;
 max-width: 520px;
 margin-bottom: 24px;
}

/*----------*/
.pickupBaseText p{
 margin-bottom: 24px;
 text-align: center;
}

/*----------*/
.pickupBaseText h2{
 width: 100%;
 max-width: 480px;
}

/*------------------------------ pickup個別設定 */
.pickup01 .pickupBaseText h2 br,
.pickup03 .pickupBaseText h2 br{ display: none;}

.pickupBaseText p br.u-br0101{ display: block;}

}/*----- media -----*/

/*============================== ■ max-width 767 */
@media screen and (max-width: 767px){
.pickupBase--deco01{
 position: absolute; top: -46px; left: -4px;
 width: calc(218px * 0.6);
}

.pickupBase--deco02{
 position: absolute; top: -46px; right: -4px;
 width: calc(218px * 0.6);
}
}/*----- media -----*/

/*============================== ■ max-width 520 */
@media screen and (max-width: 520px){
/*------------------------------ pickup共通設定 */
.pickupBase--deco01{
 position: absolute; top: -20px; left: -12px;
 width: calc(218px * 0.4);
}

.pickupBase--deco02{
 position: absolute; top: -20px; right: -12px;
 width: calc(218px * 0.4);
}
/*----------*/
.pickupBaseText p{
 text-align: left
}

/*------------------------------ pickup個別設定 */
.pickup01 .pickupBaseText h2 br,
.pickup03 .pickupBaseText h2 br{ display: block;}
.pickupBaseText p br.u-br0101{ display: none;}

}/*----- media -----*/


/*========================================
　●　情報エリア
========================================*/
.infoArea{
 overflow: hidden;
 display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
 width: 100%;
 max-width: 805px;
 margin-left: auto;
 margin-right: auto;
 padding-left: 10px;
 padding-right: 10px;
}

.infoList{
 width: calc(100% - 300px);
 max-width: 430px;
}

.infoList h2{
 margin-top: 10px;
 margin-bottom: 32px;
}

.infoSns{
 width: 300px;
 padding-top: 12px;
}

/*----------*/
.infoMain{}

.infoMain dl{
 display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  justify-content: flex-start;
 margin-bottom: 8px;
}

.infoMain dl:last-of-type{ margin-bottom: 0px;}

.infoMain dt{
 width: 186px;
 height: 36px;
 padding: 4px 6px 4px 6px;
 color: #fff;
 line-height: 1.8;
 background: #44245d;
 border-radius: 8px;
}

.info--icon{ margin-right: 7px; vertical-align: -7px;}

.infoMain dd{
 padding-top: 3px;
 padding-left: 14px;
 line-height: 1.8;
}

.infoMain dd .u-br01{ display: block;}

/*----------*/
.info--fb{
 height: 320px;
 margin-bottom: 8px;
}

a.info--insta{
 display: block;
 width: 100%;
 max-width: 300px;
 height: 60px;
 padding-top: 11px;
 padding-left: 20px;
 text-decoration: none;
 background: url("../images/parts/mark_arrow01.png") no-repeat calc(100% - 15px) center,#fff;
 border: 1px solid #b686db;
 border-radius: 10px;
 transition: all 0.3s ease-out;
}

a.info--insta:hover{ background: url("../images/parts/mark_arrow01.png") no-repeat calc(100% - 10px) center,#f6f2fb;}


/*============================== ■ max-width 1087 */
@media screen and (max-width: 1087px){}/*----- media -----*/

/*============================== ■ max-width 767 */
@media screen and (max-width: 767px){
.infoArea{
 display: flex;
  align-items: center;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
 width: 100%;
 max-width: 520px;
 margin-left: auto;
 margin-right: auto;
 padding-left: 10px;
 padding-right: 10px;
}

.infoList{
 width: 100%;
 max-width: 300px;
}

.infoSns{
 width: 100%;
 max-width: 300px;
 padding-bottom: 0px;
}

.infoSns img{ width: auto; min-height: 63%;}


/*----------*/
.infoMain{}

.infoMain dl{
 display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  justify-content: center;
 margin-bottom: 16px;
}

.infoMain dt{ width: 100%;}

.infoMain dd{ width: 100%; padding-left: 8px;}
.infoMain dd .u-br01{ display: none;}

/*----------*/
a.info--insta{
 width: 100%;
 max-width: 300px;
 margin-left: auto;
 margin-right: auto;
 padding-left: 12px;
}

}/*----- media -----*/

/*============================== ■ max-width 520 */
@media screen and (max-width: 520px){}/*----- media -----*/



/*追加CSS*/
.adjust01{
	display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-end;
    width: 100%;
    max-width: 1000px;
    margin: 30px auto 0;
}
.adjust02{
	width: 38%;
	height: auto;
}
.adjust03{
	width: 60%;
	height: auto;
}
/*============================== ■ max-width 520 */
@media screen and (max-width: 520px){
	.adjust02{
	width: 100%;
	height: auto;
	}
	.adjust03{
		width: 100%;
		height: auto;
	}
}/*----- media -----*/