/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼　メイン３セクション＋contents▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
@media screen and (max-width: 768px) {
.pc{display:none!important;}
}

@media screen and (min-width: 769px) {
.sma{display:none!important;}
}



@media screen and (min-width: 451px) {
.sma450{display:none!important;}
}


@media screen and (max-width: 450px){
.pc450{display:none;}
}



@media screen and (min-width: 380px) {
.sma380{display:none!important;}
}

@media screen and (max-width: 379px) {
.pc380{display:none!important;}
}

@media screen and (max-width: 1023px) {
.tab1024{display:none!important;}
}

@media screen and (max-width: 1439px) {
.laptop1440{display:none!important;}
}


.illust_logo_none{display:none;}
.illust_yoko_yoko_none{display:none;}
.illust_old_yoko_none{display:none;}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼　メイン３セクション＋contents▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.title_bar{
  padding:0 auto;
  background-color: black;
  height:50px;
  margin:44px auto auto auto ;
  font-size:110%;
width:100%;
display: inline-flex; /* 要素をインライン用のflexコンテナとして定義する */
justify-content: center;/* flexアイテムの上下中央を指定する */
align-items: center; /* flexアイテムの左右中央を指定する */
}

#section {
margin           : 0 auto;
width            : 100%;
background-color : rgba(255,255,255,0);
text-align:center;
margin-bottom:-20px!important;
}

#section-main_visual{
width        : 100%;
margin           : 0 auto;
padding          : 0px;
}

#section-main_visual_in{
max-width        : 1024px;
margin           : 0 auto;
padding          : 0px;
}

#section-main_body{
max-width        : 100%;
margin           : 0 auto;
}


.section-contents{/*main_body内に複数設置可*/
max-width        : 100%;
margin           : 0 auto;
padding:50px auto;
}



#section-main_footer{
max-width        : 100%;
margin           : -50px auto 0 auto;
}


/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ section-contents内　サブセクション：1カラム▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.section-sub_01{
max-width:1024px;
margin:0 auto;
}

@media screen and (max-width: 1023px) {
.section-sub_01{
max-width:100%;
width:100%;
margin:0px;
padding:10px!important;
}
}

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼  section-contents内　サブセクション：2カラム▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

/*参考
#pulldownlist2#
illust_logo:初期ロゴ
illust_logo_new:初期ロゴNEW
illust_tate:縦イラスト
illust_yoko:横イラスト
illust_old:横イラスト
illust_text:テキスト
*/


/*-------------------------
プチオンリー初期ロゴの2カラム
-------------------------*/
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_logo_puti{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_logo_puti{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_logo_puti{width:100%;margin:10px 0px auto 0px!important;height: auto;padding:5px 5px 10px 5px; border-radius:5px; }
.visual_order1_illust_logo_puti{order:1; margin:0;height:auto;}
.visual_order2_illust_logo_puti{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_logo_puti{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_logo_puti{display:flex; width:67%; height: auto; padding:0 10px 0 0;}
.visual_order1_in_down_illust_logo_puti{width:33%; margin-top:0px;height:auto; margin-bottom:10px;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_logo_puti{width:50%; height: auto; margin:0 3px; padding:0; border:solid 1px #999;color:#fff;}
.visual_order1_in_up_middle_illust_logo_puti{width:50%; height: auto; margin:0 3px; padding:0; border:solid 1px #999;}
/*左概要の上段tableの上下-------------------------*/


@media screen and (max-width: 768px) {
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_logo_puti{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_logo_puti{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_logo_puti{width:100%;margin:0 5px;height: auto;padding:5px 5px 10px 5px; }
.visual_order1_illust_logo_puti{order:1; margin:0;height:auto;}
.visual_order2_illust_logo_puti{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_logo_puti{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_logo_puti{display:block; width:50%; height: auto;margin:0 3px; padding:0;border:solid 1px gray;}
.visual_order1_in_down_illust_logo_puti{width:50%; margin-top:0px;height:auto; margin-bottom:10px;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_logo_puti{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
.visual_order1_in_up_middle_illust_logo_puti{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
/*左概要の上段tableの上下-------------------------*/
}

@media screen and (max-width: 450px) {
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_logo_puti{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_logo_puti{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_logo_puti{width:100%;margin:0 5px;height: auto;padding:5px 5px 10px 5px; }
.visual_order1_illust_logo_puti{order:1; margin:0;height:auto;}
.visual_order2_illust_logo_puti{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_logo_puti{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_logo_puti{display:block; width:100%; height: auto;margin:0 3px; padding:0;border:solid 1px gray;}
.visual_order1_in_down_illust_logo_puti{display:none;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_logo_puti{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
.visual_order1_in_up_middle_illust_logo_puti{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
/*左概要の上段tableの上下-------------------------*/
}




/*-------------------------
プチ横イラスト（illust_old）の2カラム
-------------------------*/
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_old{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_old{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_old{width:100%;margin:10px 0px auto 0px!important;height: auto;padding:5px 5px 10px 5px; border-radius:5px; }
.visual_order1_illust_old{order:1; margin:0;height:auto;}
.visual_order2_illust_old{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_old{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_old{display:flex; width:67%; height: auto; padding:0 10px 0 0;}
.visual_order1_in_down_illust_old{width:33%; margin-top:0px;height:auto; margin-bottom:10px;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_old{width:50%; height: auto; margin:0 3px; padding:0; border:solid 1px #999;color:#fff;}
.visual_order1_in_up_middle_illust_old{width:50%; height: auto; margin:0 3px; padding:0; border:solid 1px #999;}
/*左概要の上段tableの上下-------------------------*/


@media screen and (max-width: 768px) {
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_old{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_old{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_old{width:100%;margin:0 5px;height: auto;padding:5px 5px 10px 5px; }
.visual_order1_illust_old{order:1; margin:0;height:auto;}
.visual_order2_illust_old{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_old{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_old{display:block; width:50%; height: auto;margin:0 3px; padding:0;border:solid 1px gray;}
.visual_order1_in_down_illust_old{width:50%; margin-top:0px;height:auto; margin-bottom:10px;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_old{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
.visual_order1_in_up_middle_illust_old{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
/*左概要の上段tableの上下-------------------------*/
}

@media screen and (max-width: 450px) {
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_old{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_old{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_old{width:100%;margin:0 5px;height: auto;padding:5px 5px 10px 5px; }
.visual_order1_illust_old{order:1; margin:0;height:auto;}
.visual_order2_illust_old{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_old{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_old{display:block; width:100%; height: auto;margin:0 3px; padding:0;border:solid 1px gray;}
.visual_order1_in_down_illust_old{display:none;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_old{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
.visual_order1_in_up_middle_illust_old{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
/*左概要の上段tableの上下-------------------------*/
}





/*-------------------------
初期ロゴの2カラム
-------------------------*/
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_logo{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_logo{max-width:100%; width:auto; margin:0px auto; height:auto;}
.section-sub_02_r_illust_logo{width:100%;margin:10px 0px auto 0px!important;height: auto;padding:5px 5px 10px 5px; border-radius:5px; }
.visual_order1_illust_logo{order:1; margin:0;height:auto;}
.visual_order2_illust_logo{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_logo{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_logo{display:flex; width:67%; height: auto; padding:0 10px 0 0;}
.visual_order1_in_down_illust_logo{width:33%; margin-top:0px;height:auto; margin-bottom:10px;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_logo{width:50%; height: auto; margin:0 3px; padding:0; border:solid 1px #999;color:#fff;}
.visual_order1_in_up_middle_illust_logo{width:50%; height: auto; margin:0 3px; padding:0; border:solid 1px #999;}
/*左概要の上段tableの上下-------------------------*/


@media screen and (max-width: 768px) {
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_logo{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_logo{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_logo{width:100%;margin:0 5px;height: auto;padding:5px 5px 10px 5px; }
.visual_order1_illust_logo{order:1; margin:0;height:auto;}
.visual_order2_illust_logo{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_logo{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_logo{display:block; width:50%; height: auto;margin:0 3px; padding:0;border:solid 1px gray;}
.visual_order1_in_down_illust_logo{width:50%; margin-top:0px;height:auto; margin-bottom:10px;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_logo{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
.visual_order1_in_up_middle_illust_logo{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
/*左概要の上段tableの上下-------------------------*/
}

@media screen and (max-width: 450px) {
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_logo{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_logo{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_logo{width:100%;margin:0 5px;height: auto;padding:5px 5px 10px 5px; }
.visual_order1_illust_logo{order:1; margin:0;height:auto;}
.visual_order2_illust_logo{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_logo{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_logo{display:block; width:100%; height: auto;margin:0 3px; padding:0;border:solid 1px gray;}
.visual_order1_in_down_illust_logo{display:none;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_logo{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
.visual_order1_in_up_middle_illust_logo{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
/*左概要の上段tableの上下-------------------------*/
}


/*-------------------------
横イラストの2カラム
-------------------------*/
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_yoko{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_yoko{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_yoko{width:100%;margin:10px 0px auto 0px!important;height: auto;padding:5px 5px 10px 5px; border-radius:5px; }
.visual_order1_illust_yoko{order:1; margin:0;height:auto;}
.visual_order2_illust_yoko{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_yoko{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_yoko{display:flex; width:67%; height: auto; padding:0 10px 0 0;}
.visual_order1_in_down_illust_yoko{width:33%; margin-top:0px;height:auto; margin-bottom:10px;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_yoko{width:50%; height: auto; margin:0 3px; padding:0; border:solid 1px #999;color:#fff;}
.visual_order1_in_up_middle_illust_yoko{width:50%; height: auto; margin:0 3px; padding:0; border:solid 1px #999;}
/*左概要の上段tableの上下-------------------------*/


@media screen and (max-width: 768px) {
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_yoko{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_yoko{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_yoko{width:100%;margin:0 5px;height: auto;padding:5px 5px 10px 5px; }
.visual_order1_illust_yoko{order:1; margin:0;height:auto;}
.visual_order2_illust_yoko{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_yoko{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_yoko{display:block; width:50%; height: auto;margin:0 3px; padding:0;border:solid 1px gray;}
.visual_order1_in_down_illust_yoko{width:50%; margin-top:0px;height:auto; margin-bottom:10px;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_yoko{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
.visual_order1_in_up_middle_illust_yoko{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
/*左概要の上段tableの上下-------------------------*/
}

@media screen and (max-width: 450px) {
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_yoko{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_yoko{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_yoko{width:100%;margin:0 5px;height: auto;padding:5px 5px 10px 5px; }
.visual_order1_illust_yoko{order:1; margin:0;height:auto;}
.visual_order2_illust_yoko{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_yoko{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_yoko{display:block; width:100%; height: auto;margin:0 3px; padding:0;border:solid 1px gray;}
.visual_order1_in_down_illust_yoko{display:none;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_yoko{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
.visual_order1_in_up_middle_illust_yoko{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
/*左概要の上段tableの上下-------------------------*/
}



/*-------------------------
縦イラストの2カラム
-------------------------*/

/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_tate{/*flex*/
max-width:1024px;
margin:0 auto;
padding-bottom: 10px;
display:flex;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_tate{max-width:804px; width:auto; margin:0 auto; height: auto;}
.section-sub_02_r_illust_tate{width:220px;margin:0 5px;height: auto;padding:5px 5px 10px 5px;}
.visual_order1_illust_tate{order:1; margin:0;height:auto;}
.visual_order2_illust_tate{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_tate{height:auto;display:block;}

.visual_order1_in_up_illust_tate{display:block;width:220px; height: auto; padding:0 10px 0 0;}
.visual_order1_in_down_illust_tate{margin-top:10px;height:450px;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/


/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_tate{width:220px; height: auto; padding:0 10px 0 0;}
.visual_order1_in_up_middle_illust_tate{width:220px; height: auto; padding:0 10px 0 0;}
/*左概要の上段tableの上下-------------------------*/



@media screen and (max-width: 1023px) {
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_tate{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_tate{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_tate{width:100%;margin:0 5px;height: auto;padding:5px 5px 10px 5px; }
.visual_order1_illust_tate{order:1; margin:0;height:auto;}
.visual_order2_illust_tate{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_tate{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_tate{display:flex; width:67%; height: auto; padding:0 10px 0 0;}
.visual_order1_in_down_illust_tate{width:33%; margin-top:0px;height:auto; margin-bottom:10px;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_tate{width:50%; height: auto; margin:0 3px; padding:0; border:solid 1px gray;}
.visual_order1_in_up_middle_illust_tate{width:50%; height: auto; margin:0 3px; padding:0; border:solid 1px gray;}
/*左概要の上段tableの上下-------------------------*/
}


@media screen and (max-width: 768px) {
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_tate{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_tate{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_tate{width:100%;margin:0 5px;height: auto;padding:5px 5px 10px 5px; }
.visual_order1_illust_tate{order:1; margin:0;height:auto;}
.visual_order2_illust_tate{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_tate{width:100%; height:auto; display:flex;}

.visual_order1_in_up_illust_tate{display:block; width:50%; height: auto; padding:0; margin:3px;border:solid 1px gray;}
.visual_order1_in_down_illust_tate{width:50%; margin-top:0px;height:auto; margin-bottom:10px;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_tate{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
.visual_order1_in_up_middle_illust_tate{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
/*左概要の上段tableの上下-------------------------*/
}


@media screen and (max-width: 450px) {
/*左概要・右イラストの大枠-------------------------*/
.section-sub_02_illust_tate{/*flex*/
max-width:1024px;
margin:-5px auto 0 auto;
padding-bottom: 10px;
display:block;
justify-content: center;
}
/*左右カラム*/
.section-sub_02_l_illust_tate{max-width:100%; width:auto; margin:0px auto; height: auto;}
.section-sub_02_r_illust_tate{width:100%;margin:0 5px;height: auto;padding:5px 5px 10px 5px; }
.visual_order1_illust_tate{order:1; margin:0;height:auto;}
.visual_order2_illust_tate{order:2; margin:0;}
/*左概要・右イラストの大枠-------------------------*/


/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/
.visual_order1_in_illust_tate{width:100%; height:auto; display:block;}

.visual_order1_in_up_illust_tate{display:block; width:100%; height: auto; padding:0; margin:0 auto;border:solid 1px gray;}
.visual_order1_in_down_illust_tate{width:100%; display:none;}
/*左概要の上段・下段（上段table と 下段divボタン）-------------------------*/

/*左概要の上段tableの上下-------------------------*/
.visual_order1_in_up_up_illust_tate{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
.visual_order1_in_up_middle_illust_tate{width:100%; height: auto; margin:0px; padding:0; border:solid 0px gray;}
/*左概要の上段tableの上下-------------------------*/
}




/*---------------------------------------
main_visualの左_下段ボタンの画像センター配置
---------------------------------------*/
.image_center8{
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);

max-width: 100%;
max-height: 100%;
padding:1%!important;
}

.image_center8 img{margin:10%;}


.image_center2{
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);

max-width: 100%;
max-height: 100%;
}

.image_center2 img{margin:1%;}


/*-------------------------
main_bodyの2カラム
-------------------------*/

.section-sub_02b{/*flex*/
width:100%;
max-width:1024px;
margin:0 auto;
padding-bottom: 10px;
display:flex;
justify-content: center;
position:relative;
}

.section-sub_02b_l_illust_tate{max-width:760px; order: 1!important;padding:0 5px 0 0!important; background-color:; border:solid 0px lightgrey;}
.section-sub_02b_r_illust_tate{width:260px; order:2!important; background-color:;overflow:hidden;}


@media screen and (max-width: 1023px) {
.section-sub_02b{/*block　1列になります。*/
max-width:initial;
width:100%!important;
margin:0;
padding:5px!important;
padding-bottom: 10px;
display:block;
justify-content: initial;
}

.section-sub_02b p{padding:0 5px;}

.section-sub_02b_l_illust_tate{max-width:initial;width:100%;}
.section-sub_02b_r_illust_tate{width:100%;}
}

@media screen and (max-width: 450px) {
.section-sub_02b_l_illust_tate{border:solid 0px lightgrey; padding:0px!important;}
}




/*-------------------------
main_bodyの2カラム｜２等分
-------------------------*/
.section-sub_02c{/*flex*/
max-width:1024px;
width:100%;
margin:0 auto;
padding-bottom: 10px;
display:flex;
justify-content: center;
position:relative;
}

.section-sub_02c_l{max-width:794px; width:50%; order: 1!important; margin:5px;background-color:; border:solid 0px lightgrey; padding:0px!important;}
.section-sub_02c_r{max-width:794px; width:50%; order: 2!important; margin:5px;background-color:; border:solid 0px lightgrey; padding:0px!important;}


@media screen and (max-width: 1023px) {
.section-sub_02c{/*block*/
max-width:initial;
width:97%;
margin:0;
padding-bottom: 10px;
display:block;
justify-content: initial;
}
.section-sub_02c_l{max-width:initial; width:100%;}
.section-sub_02c_r{max-width:initial; width:100%;}
}


/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼　最上段右上のミニリンク　▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.top_minilink{
  font-size: 65%;
  text-align:right!important;
  margin-right:50px;
  padding-top:15px
}

.top_minilink a{
  padding-right:15px;
  text-decoration:none;
  color:#404040FF!important;
}

.top_minilink a:before{
  content      : " \f32b";
  font-weight  : 300!important;
  font-family  : "Font Awesome 5 Pro";
  margin-right : 3px;
  color:#404040FF!important;
}


/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ ビジュアル横の概要▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

/*初期ロゴ時の概要*/
span.outline_illust_logo table{width:100%;}

span.outline_illust_logo table th,.outline_illust_logo table td{display:block;}

span.outline_illust_logo th{background-color:rgba(255,255,255,0.3); }
span.outline_illust_logo th{text-align:center; font-size:13px; vertical-align:;color:#fff;}

span.outline_illust_logo td{padding:5px 0px; vertical-align:middle; }
span.outline_illust_logo td p{text-align:center; font-family: 'Noto Sans JP', sans-serif!important; font-weight:500;/*ゴシック*/ line-height:1.2em!important;letter-spacing: 0em;color:#fff;}

span.outline_illust_logo th{border-radius:0px;margin:0 auto; padding:3px 5px;}



/*横イラスト時の概要*/
span.outline_illust_yoko table{width:100%;}

span.outline_illust_yoko table th,.outline_illust_yoko table td{display:block;}

span.outline_illust_yoko th{background-color:rgba(255,255,255,0.3); }
span.outline_illust_yoko th{text-align:center; font-size:13px; vertical-align:;color:#fff;}

span.outline_illust_yoko td{padding:5px 0px; vertical-align:middle; }
span.outline_illust_yoko td p{text-align:center; font-family: 'Noto Sans JP', sans-serif!important; font-weight:500;/*ゴシック*/ line-height:1.2em!important;letter-spacing: 0em;color:#fff;}

span.outline_illust_yoko th{border-radius:0px;margin:0 auto; padding:3px 5px;}


/*横イラスト時の概要*/
span.outline_illust_old table{width:100%;}

span.outline_illust_old table th,.outline_illust_old table td{display:block;}

span.outline_illust_old th{background-color:rgba(255,255,255,0.3); }
span.outline_illust_old th{text-align:center; font-size:13px; vertical-align:;color:#fff;}

span.outline_illust_old td{padding:5px 0px; vertical-align:middle; }
span.outline_illust_old td p{text-align:center; font-family: 'Noto Sans JP', sans-serif!important; font-weight:500;/*ゴシック*/ line-height:1.2em!important;letter-spacing: 0em;color:#fff;}

span.outline_illust_old th{border-radius:0px;margin:0 auto; padding:3px 5px;}




/*縦イラスト時の概要*/
span.outline_illust_tate table{width:100%;}

span.outline_illust_tate table th,.outline_illust_tate table td{display:block;}

span.outline_illust_tate table th{background-color:rgba(255,255,255,0.2); border-radius:15px;}
span.outline_illust_tate table th{text-align:center; font-size:13px; vertical-align:;color:#fff;}

span.outline_illust_tate table td{padding:5px 0px; vertical-align:middle;}
span.outline_illust_tate table td p{text-align:center; font-family: 'Noto Sans JP', sans-serif!important; font-weight:500;/*ゴシック*/ line-height:1.2em!important;letter-spacing: 0em;color:#fff;}


@media screen and (max-width: 1023px) {
span.outline_illust_tate table th{border-radius:0px;margin:0 auto; padding:3px 5px;}

}



/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ サークル参加概要・一般参加概要など▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

table.outline2{width:100%; border: solid 2px lightgray;}

.outline2 tr{border:solid 1px lightgray;}

.outline2 th{padding:5px 50px;border:solid 1px #fff;}

.outline2 th{
font-weight: 400;
background-color     : lightgray;
width                : 200px;
-moz-text-align-last : justify;
text-align-last      : justify;
text-justify         : inter-ideograph;
}

.outline2 th{vertical-align: middle!important;}


.outline2 td{
  background-color:#f9f9f9;
  padding:10px 10px;
  text-align: left;
}


@media screen and (max-width: 450px) {
.outline2 th,.outline2 td{display:block; width: 100%!important;}
.outline2 th {padding:5px auto;text-align:center; font-size:14px;
-moz-text-align-last : initial;
text-align-last      : initial;
text-justify         : initial;}

.outline2 td{text-align:center; font-size:14px; line-height:1.2em; word-wrap: break-all;}

}




/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ 企画フォーム用テーブル▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

table.outline3{width:100%; border: solid 2px lightgray;}

.outline3 tr{border:solid 1px lightgray;}

.outline3 th{padding:5px 30px;border:solid 1px #fff;}

.outline3 th{
font-weight: 400;
background-color     : lightgray;
width                : 200px;
-moz-text-align-last : justify;
text-align-last      : justify;
text-justify         : inter-ideograph;
}

.outline3 th{vertical-align: middle!important;}


.outline3 td{
background-color:#f9f9f9;
padding:10px 10px;
text-align: left;
border: solid 1px lightgray;
}


@media screen and (max-width: 450px) {
.outline3 th,.outline3 td{display:block;}
.outline3 th {width:100%; padding:5px auto;text-align:center; font-size:14px;
-moz-text-align-last : initial;
text-align-last      : initial;
text-justify         : initial;}

.outline3 td{text-align:center; font-size:14px; line-height:1.2em; word-wrap: break-all;}

}




/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ noticeテーブル▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

table.outline4{width:100%; border: solid 2px lightgray;}

.outline4 tr{border:solid 1px lightgray;}

.outline4 th{border:solid 1px #fff;}

.outline4 th{
font-weight: 400;
background-color     : lightgray;
width                : 350px;
-moz-text-align-last : justify;
text-align-last      : justify;
text-justify         : inter-ideograph;
font-size:17px!important;
padding:10px 20px!important;
}

.outline4 th{vertical-align: middle!important;}


.outline4 td{
background-color:#f9f9f9;
padding:10px 20px!important;
text-align: left;
border: solid 1px lightgray;
font-size:17px!important;
}


@media screen and (max-width: 450px) {
.outline4 th,.outline4 td{display:block;}
.outline4 th {width:100%; padding:5px auto;text-align:center; font-size:14px;
-moz-text-align-last : initial;
text-align-last      : initial;
text-justify         : initial;}

.outline4 td{text-align:center; font-size:14px; line-height:1.2em; word-wrap: break-all;}

}





/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ 公式ガイド用テーブル▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

table.outline4{width:100%; border: solid 2px lightgray!important;}

.outline4 tr{border:solid 1px lightgray!important;}

.outline4 th{padding:5px 30px;border:solid 1px #fff;}

.outline4 th{
font-weight: 400;
background-color     : lightgray!important;
width                : 200px;
-moz-text-align-last : justify;
text-align-last      : justify;
text-justify         : inter-ideograph;
}

.outline4 th{vertical-align: middle!important;}


.outline4 td{
background-color:#f9f9f9;
padding:10px 10px;
text-align: left;
border:solid 1px lightgray!important;
}


@media screen and (max-width: 450px) {
.outline4 th,.outline4 td{display:block;}
.outline4 th {width:100%; padding:5px auto;text-align:center; font-size:14px;
-moz-text-align-last : initial;
text-align-last      : initial;
text-justify         : initial;}

.outline4 td{text-align:center; font-size:14px; line-height:1.2em; word-wrap: break-all;}

}






/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ 公式ガイド用｜イラスト公募・七夕等の対応イベントリスト用▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

table.outline5{width:100%; border: solid 2px lightgray!important;}

.outline5 tr{border:solid 1px lightgray!important;}

.outline5 th{padding:5px 20px!important; border: solid 1px #fff;}

.outline5 th{
font-weight: 400;
background-color     : lightgray!important;
width                : 300px;
-moz-text-align-last : justify;
text-align-last      : justify;
text-justify         : inter-ideograph;
}

.outline5 th{vertical-align: middle!important;}


.outline5 td{
background-color:#f9f9f9;
padding:10px 10px;
text-align: left;
border:solid 1px lightgray!important;
}


@media screen and (max-width: 450px) {
.outline5 th,.outline5 td{display:block;}
.outline5 th {width:100%; padding:5px auto;text-align:center; font-size:14px;
-moz-text-align-last : initial;
text-align-last      : initial;
text-justify         : initial;}

.outline5 td{text-align:left; font-size:14px; line-height:1.2em; word-wrap: break-all;}

}




/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ シークレットサイト入口ID/PASSなど▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

table.outline2b{width:100%; border: solid 2px lightgray;}

.outline2b tr{border:solid 1px lightgray;}

.outline2b th{padding:5px 20px;border:solid 1px #fff;}

.outline2b th{
font-weight: 400;
background-color     : lightgray;
width                : 300px;
-moz-text-align-last : justify;
text-align-last      : justify;
text-justify         : inter-ideograph;
}

.outline2b th{vertical-align: middle!important;}


.outline2b td{
  background-color:#f9f9f9;
  padding:10px 10px;
  text-align: left;
}


@media screen and (max-width: 450px) {
.outline2b th,.outline2b td{display:block;}
.outline2b th {width:100%; padding:5px auto;text-align:center; font-size:14px;
-moz-text-align-last : initial;
text-align-last      : initial;
text-justify         : initial;}

.outline2b td{text-align:center; font-size:14px; line-height:1.2em; word-wrap: break-all;}

}

.maru_logo_key{
background-image:url(https://dl.dropboxusercontent.com/s/kbh1a9h9bqbxkx0/key.png);  
background-size:190px; 
background-repeat:no-repeat; 
background-position: center center;
border-radius:50%; 
width: 200px; 
height:200px;
margin:-135px auto 50px auto; 
background-color:rgba(255,255,255,0.75);"
}

.maru_logo_key:hover{
background-image:url(https://dl.dropboxusercontent.com/s/432z48sjbf88idw/key_hover.png);  
background-size:190px; 
background-repeat:no-repeat; 
background-position: center center;
border-radius:50%; 
width: 200px; 
height:200px;
margin:-135px auto 50px auto; 
background-color:rgba(255,255,255,0.75);"
}

.height100{height:100vh;}

@media screen and (max-height: 1000px) {
.height100{height:auto;}
 } 

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ div class="step"の中のテーブル▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

table.outline_in{width:100%; border:0;}
.outline_in th,.outline_in td{display:block;}

.outline_in tr{border:0;}
.outline_in th {
  height: auto;
  width: 100%;
  border-bottom: dotted 1px lightgray;
  border-left: solid 8px lightgray;
  text-indent: 10px;
  font-size:18px;
  font-weight: bold;
  background-color:initial;
  -moz-text-align-last : initial;
  text-align-last      : initial;
  text-justify         : initial;
  text-align: left;
  padding-left: 0;
}
.outline_in td{font-size:14px; line-height:1.2em;margin: 0 auto; word-wrap: break-all;}

@media screen and (max-width: 450px) {
 .outline_in th {font-size:15px;}
 .outline_in td {text-align: left;}
}


/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ remodal次回・併催内テーブル▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

table.remodal_table{width:100%; border: solid 0px lightgray;}

td.list_sousyou {
background-color:lightgray!important;
width: 100%;
padding: 0px 10px;
text-align: left!important;
vertical-align: middle!important;
font-weight: 400!important;
font-size: 15px!important;
}

td.list_title {
  background-color:#fff;
  width: 100%;
  padding:2px 10px!important;
  text-align: left!important;
  word-wrap: break-all;
}


td.list_title:hover {
background-color:#f9f9f9!important;
color: crimson!important;
}



@media screen and (max-width: 450px) {
td.list_sousyou{font-size: 13px!important;letter-spacing:0px!important;}
td.list_title {letter-spacing:0px!important;padding: 0px 2px!important;}
}





table.remodal_table2{width:100%; border: solid 0px lightgray;}

.remodal_table2 td.list_sousyou {
display: none;
}

td.list_title {
  background-color:#fff;
  width: 100%;
  padding:2px 10px!important;
  text-align: left!important;
  word-wrap: break-all;
}


td.list_title:hover {
background-color:#f9f9f9!important;
color: crimson!important;
}



@media screen and (max-width: 450px) {
td.list_sousyou{font-size: 13px!important;letter-spacing:0px!important;}
td.list_title {letter-spacing:0px!important;padding: 0px 2px!important;}
}





/*次回・併催での文字設定|event #pulldownlist5#*/
.type_puti_font,/*プチ*/
.type_ccity_tamio_font/*民夫*/
{
font-size:15px!important;
font-weight: 400;
}

.type_ccity_font,/*CITY*/
.type_city_zr_font,/*ZR*/
.type_zz_aoboo_font/*青ブー*/
{
font-size:17px!important;
font-weight: 800;
}

@media screen and (max-width: 450px) {
.type_puti_font,/*プチ*/
.type_ccity_tamio_font/*民夫*/
{
font-size:13px!important;
}

.type_ccity_font,/*CITY*/
.type_city_zr_font,/*ZR*/
.type_zz_aoboo_font/*青ブー*/
{
font-size:14px!important;
}
}


.type_city_zr_01{display:none;}
.type_ccity_00{display:none;}



/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ 手順サークル参加概要・一般参加概要など▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.step {
  position: relative;
  display: inline-block;
  margin: 0 0 1.5em 0;
  padding: 7px 10px;
  width: 100%;
  color: #555;
  background: #e0edff;
        word-break: keep-all;
  line-break: strict;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.step{
font-weight:400;
font-size: 15px!important;
line-height: 1.5em!important;
}

.step:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #e0edff;
}


.step_no{
  margin:auto 15px 30px 8px!important;
  background-color:#aaaaaa;
  padding:12px 12px;
  border-radius:50%;
  border:solid 3px #fff;
  color: #fff;

}


.step_title{
  margin:-7px -10px 20px -10px;
  background-color: lightgrey;
}

.step_title p{
  line-height: 2.5em!important;
  font-size: 18px;
  font-weight: 600;
}


@media screen and (max-width: 768px) {

.step{padding: 7px 10px;}

.step_no{
  margin:auto 15px 20px 8px!important;
  background-color:#aaaaaa;
  padding:10px 10px;
  border-radius:50%;
  border:solid 3px #fff;
  color: #fff;
}

.step_title{
  margin:-7px -10px 20px -10px;
  background-color: lightgrey;
  font-weight: 600;
}
.step_title p{
  line-height: 2.5em!important;
  background-color: lightgrey;
  font-size: 17px!important;
  font-weight: 600;
}

}







/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ 吹き出しツールチップ▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

/*下線あり*/
.cp_tooltip {
  position: relative;
  display: inline-block;
  cursor: pointer;
  background: linear-gradient(transparent 80%, #f19ec2 90%);
}
.cp_tooltip .cp_tooltiptext {
  position: absolute;
  z-index: 1;
  bottom: 100%;
  left: 0;
  visibility: hidden;
  width: auto;
  white-space: nowrap;
  padding: 0.3em 0.5em;
  transition: opacity 1s;
  text-align: center;
  opacity: 0;
  color: #ffffff;
  border-radius: 6px;
  background-color: #da3c41;
  font-size: 14px;
}
.cp_tooltip .cp_tooltiptext::after {
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  content: ' ';
  border: 5px solid transparent;
  border-top-color: #da3c41;
}
.cp_tooltip:hover .cp_tooltiptext {
  visibility: visible;
  opacity: 1;
}



/*下線なし*/
.cp_tooltip2 {
  position: relative;
  display: inline-block;
  cursor: pointer;
}
.cp_tooltip2 .cp_tooltiptext {
  position: absolute;
  z-index: 1;
  bottom: 100%;
  left: 0;
  visibility: hidden;
  width: auto;
  white-space: nowrap;
  padding: 0.5em 0.8em;
  transition: opacity 1s;
  text-align: center;
  opacity: 0;
  color: #ffffff;
  border-radius: 6px;
  background-color: #da3c41;
  font-size: 14px;
}
.cp_tooltip2 .cp_tooltiptext::after {
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  content: ' ';
  border: 5px solid transparent;
  border-top-color: #da3c41;
}
.cp_tooltip2:hover .cp_tooltiptext {
  visibility: visible;
  opacity: 1;
}





/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ item_box2019▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

.item_box2019{margin: 0px auto 5px auto; padding:0px;width:100%; word-wrap:break-word;}
.item_box_line2019{margin: 0px auto 5px auto; padding:0px;width:100%; word-wrap:break-word;background-color:;border:1px solid #b3b3b3;}



/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ 続きを読む▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/

.grad-wrap {
  position: relative;
  margin-bottom: 40px;
  padding-bottom: 30px;
}
.grad-wrap + .grad-wrap {
  margin-top: 0px;
}
.grad-btn {
  z-index: 2;
  position: absolute;
  right: 0;
  bottom: -20px;
  left: 0;
  width: 148px;
  margin: auto;
  padding: .5em 0;
  border-radius: 4px;
  background:  #5873E8;
  color: #f8fdf0;
  font-size: 1.3rem;
  text-align: center;
  cursor: pointer;
  transition: .2s ease;
}
.grad-btn::after {
  content: "続きを読む"

}
.grad-btn:hover {
  background: #f8fdf0;
  color: #81d0cb;
}
.grad-btn .fa {
  margin-right: .5em;
}
.grad-item {
  position: relative;
  overflow: hidden;
  height: 0px;
}
.grad-item p + p {
  margin-top: 1em;
}
.grad-item::before {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  content: "";
  width: 100%;
  height: 0px; /*グラデーションで隠す範囲*/
  background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.9) 50%, #fff 100%);
  background: linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.9) 50%, #fff 100%);
}
.grad-trigger {
  display: none;
}
.grad-trigger:checked ~ .grad-btn {
  bottom: -2em;
}
.grad-trigger:checked ~ .grad-btn::after {
  content: "閉じる";
  margin-top: 50px;
}
.grad-trigger:checked ~ .grad-btn .fa {
  transform: rotate(180deg);
}
.grad-trigger:checked ~ .grad-item {
  height: auto;
}
.grad-trigger:checked ~ .grad-item::before {
  display: none;
}





/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーー
▼▼▼ iframe▼▼▼
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/
.iframe-wrap {
width: 100%;
padding                    : 0 0 10px 0!important;
overflow                   : auto;
-webkit-overflow-scrolling : touch;
}
.iframe-wrap iframe {
width    : 100%!important ;
border   : none;
display  : block;
margin   : 0 0 10px 0!important;
}

@media screen and (max-width: 420px){
.iframe-wrap {
margin:0 auto!important;
padding:0 auto!important;
}
	
.iframe-wrap iframe {
max-width   :410px!important ;
}
}