@charset "utf-8";

html.fixed,
body.fixed { width: 100%; height: 100%; overflow: hidden; position: fixed; }

.modal { position: fixed; display:none; z-index:99999; width: 100%; height:100%; text-align:center; top: 0; left: 0; }
.bnr_modal { width: 100%; height: 100%; cursor:pointer; text-align: center; /*display: table;*/ } 
.bnr_modal .bnr_pic { cursor: pointer; /*display: table-cell; vertical-align: top;*/ height: 100%; width: 100%; margin: 0 auto; background: #fff; padding-top: 16px; }
.bnr_modal .bnr_pic img {}
/*.bnr_modal .bnr_pic .btn_modal { position: fixed; top: 50%; right: 50%; margin-top: -290px; margin-right: -290px; cursor:pointer; } CLOSE右側 */
/*.bnr_modal .bnr_pic .btn_modal { position: fixed; top: 50%; left: 50%; margin-top: -290px; margin-left: -290px; cursor:pointer; } CLOSE左側 */
.bnr_modal .btn_modal { cursor:pointer; display: inline-block; width: 160px; height: 36px; background: #717478; color: #fff; font-size: 13px; line-height: 36px; -webkit-transition: 0.3s; transition: 0.3s; } /* CLOSE真ん中 */
.bnr_modal .btn_modal:hover { opacity: 0.6; } /* CLOSE真ん中 */

.bnr_modal .content_modal { overflow-y: scroll; padding: 0 20px; max-width: 860px; width: 100%; height: 60%; margin: 16px auto; -webkit-overflow-scrolling: touch; }
.bnr_modal .content_modal p { font-size: 10px; line-height: 18px; margin-top: 10px; }
.bnr_modal .content_modal p.txt { text-align: left; }
.bnr_modal .content_modal p.lead { text-align: center; }
.bnr_modal .content_modal p.pic { margin-top: 16px; }
.bnr_modal .content_modal p img { max-width: 800px; width: 100%; height: auto; margin: 0 auto; }
.bnr_modal .content_modal p:first-child { margin-top: 0; }


/*動画の場合*/
.bnr_modal .modal_movie { padding: 16px; }
.bnr_modal .modal_movie .btn_modal { margin-top: 20px; }
@media screen and (max-width: 640px) {
.bnr_modal .modal_movie-inner { position:relative; width:100%; padding-top:56.25%; }
.bnr_modal .modal_movie-inner iframe{ position:absolute; top:0; right:0; width:100%; height:100%; }
}
/*動画の場合*/



/********* P C *********/
@media screen and (min-width: 641px) {
.bnr_modal .bnr_pic { vertical-align: middle; width: 860px; }

.bnr_modal .content_modal { height: 70%; margin: 32px auto; }
.bnr_modal .content_modal p { font-size: 13px; line-height: 21px; margin-top: 16px; }
.bnr_modal .content_modal p.pic { margin-top: 32px; }

/*動画の場合*/
.bnr_modal { display: table; }
.bnr_modal .modal_movie { display: table-cell; vertical-align: middle; }
.bnr_modal .modal_movie .modal_movie-inner { width: 800px; margin: 0 auto;}
.bnr_modal .modal_movie .modal_movie-inner iframe {}
/*動画の場合*/

}