/*
    This is for Notice Dialog for Site.
*/
/*
  Background.
*/
.SITE_NOTICE_MBG {
  position: fixed;
  display: block;
  left: 0px;
  right: 0px;
  top: 0px;
  bottom: 0px;
  width: 100%;
  background: rgba(0,0,0,0);
}

  .SITE_NOTICE_MODAL {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    width: 600px;                   /*Width*/
    height: 100px;                  /*!!Height*/
    display: flex;                  /*Display*/
    -webkit-flex-direction: column; /*Flex_Direction*/
    flex-direction: column;
    justify-content: flex-start;    /*Flex_Justify*/
    align-items: stretch;           /*Flex_Align*/
    flex-glow: 0;                   /*Flex_Grow*/
    color: #000;                 /*TX_Color*/
    background: #FFFFFF;            /*BG_Color*/
    font-size: 10px;                /*Font_Size*/
    border: solid 1px #C0C0C0;      /*Border,Border_Color*/

    -webkit-border-radius: 0px 5px 5px 5px;
    -moz-border-radius: 0px 5px 5px 5px;
    border-radius: 0px 5px 5px 5px;
  }

  /*
    For Contents.
  */
  /*Scroll wapper.*/
  .SITE_NOTICE_MODAL .CONT_WAP{
    margin-top: 0px;
    margin-left: 7px;
    width: 570px;                   /*Width*/
    height: 70px;                  /*!!Contents Height*/
/*
    border: 1px solid #DCDCDC;
*/
    overflow-x: hidden;
    overflow-y: hidden;

  }

  /*
      Contents Area setting.
  */
  .SITE_NOTICE_MODAL .CONT_BODY{

    display: flex;
/*
    flex-direction: column;
*/

    margin-top: 0px;
    margin-left: 7px;
    width: calc( 570px + 17px );    /*Width*/
    height: 70px;                  /*!!Contents Height*/
    overflow-y: auto;

  }

  /*
    For Message and Buttons.
  */
  .SITE_NOTICE_MODAL .FUNC_BODY {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    margin-right: 7px;
  }

  .SITE_NOTICE_MODAL .FUNC_MSG {
    width: 100%;
    margin-top: 4px;
    margin-left: 24px;
    margin-bottom: 0px;
    text-align: left;
  }

  .MSG_SITE_NOTICE {
    font-size: 15px;
  }

  /* --------------------
      Edit items.
   ---------------------*/
  /*
      Function buttons
  */
  .SITE_NOTICE_BTNS {
    font-size: 12px;
    width: 60px;
    margin-top: 5px;
    margin-left: 10px;
    text-align: center;

    color: #71C5E8;
    background-color: #FFFFFF;

    border: 1px solid #71C5E8;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
  }

  .SITE_NOTICE_BTNS:hover {
    background-color: #71C5E8;
    color: #fff;
    cursor:pointer;
  }

/************************************** For SP. **************************************/
@media screen and (max-width:767px){

  .SITE_NOTICE_MODAL {
    width: 90%;                   /*Width*/
    height: auto;   
    padding:0 10px 10px 10px;               /*!!Height*/
    font-size: 14px;                /*Font_Size*/
  }

  .SITE_NOTICE_MODAL .CONT_WAP{
    margin: 0px;
    width: 90%;                   /*Width*/
    height: auto;                  /*!!Height*/
  }

  .SITE_NOTICE_MODAL .CONT_BODY{

    margin: 0px;
    width: 90%;                   /*Width*/
    height: auto;                  /*!!Height*/

  }

  /*
    For Message and Buttons.
  */
  .SITE_NOTICE_MODAL .FUNC_BODY {
    margin: 0px;
  }

  .SITE_NOTICE_MODAL .FUNC_MSG {
    margin: 0px;
  }

  .MSG_SITE_NOTICE {
    font-size: 100%;
  }


}