@charset "UTF-8";
/* CSS Document */

/* $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ */
/* ベース */
/* $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ */

/* clearfix -------------------------------------------- */
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix {
	min-height: 1px;
}

* html .clearfix {
	height: 1px;/*¥*//*/
	height: auto;
	overflow: hidden;
	/**/
}

/* FONT -------------------------------------------- */

@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 100;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 200;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 300;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 400;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 100;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 200;
}


html {
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;
}

@media all and (-ms-high-contrast: none)  {
  html {
    font-family: Verdana, Meiryo, sans-serif;
  }
}
@media all and (-ms-high-contrast: active) {
  html {
    font-family: Verdana, Meiryo, sans-serif;
  }
}

html {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* invisible -------------------------------------------- */

.invisible {
  opacity: 0.0;
}

.visible {
  opacity: 1.0;
}

/* $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ */
/* PC 720px 以上 */
/* $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ */

#block_banner {
  width: 100%;
  background-color: #FEE100;
}

#block_banner .block_banner_inner {
  width: 100%;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  max-width: 720px;
  padding: 40px 0px 40px 0px;
}

#block_banner .block_banner_inner img {
  width: 100%;
  height: auto;
}

#main {
    width: 100%;
    background-color: #FFFFFF;
}

#main .main_inner {
  width: 100%;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 0 40px 0;
  text-align: center;
  overflow-x: hidden;
}

#main .main_inner p {
  padding: 0 10px 0 10px;
}

#main .main_inner img {
  width: 100%;
  height: auto;
}

.t_contents {
    width: 100%;
    background-color: #ffffff;
    position: relative;
    padding: 40px 0px 20px 0px;
    z-index: 10;
    clear: both;
    float: left;
}

.t_contents .contents_inner {
    width: 100%;
    max-width: 740px;
    margin-left: auto;
    margin-right: auto;
    padding: 0px 30px 20px 30px;
    text-align: center;
    position: relative;
}

.t_contents .contents_inner img {
    width: 100%;
    height: auto;
}

.t_contents .contents_inner p {
    padding: 0 10px 0 10px;
}

.attention {
    width: 100%;
    height: auto;
    position: absolute;
    top: -55px;
    left: 0px;
    z-index: 10;
    padding: 0 5px 0 5px;
}

.contents {
    width: 100%;
    background-color: #FEE100;
    position: relative;
    padding: 40px 0px 20px 0px;
    z-index: 10;
    clear: both;
    float: left;
}

.contents .contents_inner {
    width: 100%;
    max-width: 740px;
    margin-left: auto;
    margin-right: auto;
    padding: 0px 30px 20px 30px;
    text-align: center;
    position: relative;
}

.contents .contents_inner img {
    width: 100%;
    height: auto;
}

.contents .contents_inner p {
    padding: 0 10px 0 10px;
}


.cont_top {
    width: 100%;
    max-width: 720px;
    position: relative;
    float: left;
}

.cont_top .new {
    position: absolute;
    width: 80px;
    height: auto;
    top: -20px;
    left: -20px;
    z-index: 10;
}

.cont_bottom {
    width: 100%;
    max-width: 720px;
    position: relative;
    float: left;
    clear: both;
    line-height: 0;
}

/*=======================================================================
	表示・非表示ボックス
========================================================================*/

.cont_hide_box_00 {
    width: 100%;
    max-width: 720px;
    position: relative;
    display: none;/*表示切り替えしたい要素は最初は非表示にしておく*/
    float: left;
}

.cont_hide_box_01 {
    width: 100%;
    max-width: 720px;
    position: relative;
    display: none;/*表示切り替えしたい要素は最初は非表示にしておく*/
    float: left;
}

.cont_hide_box_02 {
    width: 100%;
    max-width: 720px;
    position: relative;
    display: none;/*表示切り替えしたい要素は最初は非表示にしておく*/
    float: left;
}

.cont_hide_box_03 {
    width: 100%;
    max-width: 720px;
    position: relative;
    display: none;/*表示切り替えしたい要素は最初は非表示にしておく*/
    float: left;
}

.cont_hide_box_04 {
    width: 100%;
    max-width: 720px;
    position: relative;
    display: none;/*表示切り替えしたい要素は最初は非表示にしておく*/
    float: left;
}

.cont_hide_box_05 {
    width: 100%;
    max-width: 720px;
    position: relative;
    display: none;/*表示切り替えしたい要素は最初は非表示にしておく*/
    float: left;
}

.cont_hide_box_06 {
    width: 100%;
    max-width: 720px;
    position: relative;
    display: none;/*表示切り替えしたい要素は最初は非表示にしておく*/
    float: left;
}

.cont_hide_box_07 {
    width: 100%;
    max-width: 720px;
    position: relative;
    display: none;/*表示切り替えしたい要素は最初は非表示にしておく*/
    float: left;
}

.cont_hide_box_08 {
    width: 100%;
    max-width: 720px;
    position: relative;
    display: none;/*表示切り替えしたい要素は最初は非表示にしておく*/
    float: left;
}

.cont_hide_box_09 {
    width: 100%;
    max-width: 720px;
    position: relative;
    display: none;/*表示切り替えしたい要素は最初は非表示にしておく*/
    float: left;
}

.cont_hide_box_10 {
    width: 100%;
    max-width: 720px;
    position: relative;
    display: none;/*表示切り替えしたい要素は最初は非表示にしておく*/
    float: left;
}

.cont_hide_box_12 {
    width: 100%;
    max-width: 720px;
    position: relative;
    display: none;/*表示切り替えしたい要素は最初は非表示にしておく*/
    float: left;
}

/*======================================================================*/


.cont_unit {
    width: 100%;
    max-width: 720px;
    position: relative;
    float: left;
    clear: both;
}

.cont_btn_box {
    width: 100%;
    max-width: 720px;
    position: relative;
    float: left;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
    padding: 10px 50px 30px 50px;
    clear: both;
}

.cont_btn_box a img:hover {
    opacity: 0.8;
}

/*黄色いボタンの背景がピンクの場合*/
.pink {
    background-repeat: repeat-y;
    background-image: url(../images/bg_pink.png);
    background-position: left top;
    background-size: 100% auto;
    
}

/*黄色いボタンの背景が白の場合*/
.white {
    background-repeat: repeat-y;
    background-image: url(../images/bg_white.png);
    background-position: left top;
    background-size: 100% auto;
}


/*=======================================================================
	トグルボタン
========================================================================*/
/*--00----------------------------------*/
.cont_open_00 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_oubo.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_open_00:hover {
    cursor: pointer;
}

.cont_close_00 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_close.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_close_00:hover {
    cursor: pointer;
}

/*--01----------------------------------*/
.cont_open_01 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_open.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_open_01:hover {
    cursor: pointer;
}

.cont_close_01 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_close.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_close_01:hover {
    cursor: pointer;
}

/*--02----------------------------------*/
.cont_open_02 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_open.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_open_02:hover {
    cursor: pointer;
}

.cont_close_02 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_close.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_close_02:hover {
    cursor: pointer;
}

/*--03----------------------------------*/
.cont_open_03 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_open.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_open_03:hover {
    cursor: pointer;
}

.cont_close_03 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_close.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_close_03:hover {
    cursor: pointer;
}

/*--04----------------------------------*/
.cont_open_04 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_open.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_open_04:hover {
    cursor: pointer;
}

.cont_close_04 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_close.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_close_04:hover {
    cursor: pointer;
}

/*--05----------------------------------*/
.cont_open_05 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_open.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_open_05:hover {
    cursor: pointer;
}

.cont_close_05 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_close.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_close_05:hover {
    cursor: pointer;
}

/*--06----------------------------------*/
.cont_open_06 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_open.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_open_06:hover {
    cursor: pointer;
}

.cont_close_06 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_close.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_close_06:hover {
    cursor: pointer;
}

/*--07----------------------------------*/
.cont_open_07 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_open.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_open_07:hover {
    cursor: pointer;
}

.cont_close_07 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_close.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_close_07:hover {
    cursor: pointer;
}

/*--08----------------------------------*/
.cont_open_08 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_open.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_open_08:hover {
    cursor: pointer;
}

.cont_close_08 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_close.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_close_08:hover {
    cursor: pointer;
}

/*--09----------------------------------*/
.cont_open_09 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_open.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_open_09:hover {
    cursor: pointer;
}

.cont_close_09 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_close.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_close_09:hover {
    cursor: pointer;
}

/*--10----------------------------------*/
.cont_open_10 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_open.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_open_10:hover {
    cursor: pointer;
}

.cont_close_10 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_close.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_close_10:hover {
    cursor: pointer;
}



/*--02----------------------------------*/
.cont_open_12 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_kaizen.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}
.cont_open_12:hover {
    cursor: pointer;
}

.cont_close_12 {
    width: 100%;
    max-width: 720px;
    float: left;
    clear: both;
    background-image: url(../images/toggle_close.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% 100%;
}

.cont_close_12:hover {
    cursor: pointer;
}


/*=======================================================================
	footer
========================================================================*/

footer {
    width: 100%;
    background-color: #FFFFFF;
    float: left;
    clear: both;
}

footer .footer_inner {
    width: 100%;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
    padding: 20px 0 20px 0;
    text-align: center;
}

footer .footer_inner .social_icon {
    width: 100%;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
    padding: 20px 0 20px 0;
    text-align: center;
}

footer .footer_inner .social_icon li {
    width: 65px;
    margin: 0 20px 0 20px;
	display: inline-block;
    
}

footer .footer_inner .social_icon li img {
    width: 100%;
}

footer .footer_inner .social_icon li img:hover {
    opacity: 0.7;
}

footer .footer_inner small {
    width: 100%;
    padding: 10px 10px 40px 10px;
    text-align: center;
    color: #787878;
    float: left;
    clear: both;
}


/* $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ */
/* SP 720px 以下 */
/* $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$ */

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


/*=======================================================================
	SP
========================================================================*/

.t_contents {
    width: 100%;
    background-color: #ffffff;
    position: relative;
    padding: 3vw 0px 3vw 0px;
    z-index: 10;
    clear: both;
    float: left;
}

.contents {
    width: 100%;
    background-color: #FEE100;
    position: relative;
    padding: 5vw 0px 1vw 0px;
    z-index: 10;
    clear: both;
    float: left;
}

#block_banner .block_banner_inner {
  width: 100%;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  max-width: 720px;
  padding: 5vw 0px 5vw 0px;
}


.t_contents .contents_inner {
    width: 100%;
    max-width: 740px;
    margin-left: auto;
    margin-right: auto;
    padding: 0px 4.5vw 4.5vw 4.5vw;
    text-align: center;
    position: relative;
}

.attention {
    width: 100%;
    height: auto;
    position: absolute;
    top: -7.5vw;
    left: 0px;
    z-index: 10;
    padding: 0 5px 0 5px;
}

.contents .contents_inner {
    width: 100%;
    max-width: 740px;
    margin-left: auto;
    margin-right: auto;
    padding: 0px 4.5vw 4.5vw 4.5vw;
    text-align: center;
    position: relative;
}

.cont_top .new {
    position: absolute;
    width: 11vw;
    height: auto;
    top: -2.7vw;
    left: -2.7vw;
    z-index: 10;
}


.cont_btn_box {
    width: 100%;
    max-width: 720px;
    position: relative;
    float: left;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
    padding: 3vw 7vw 3vw 7vw;
}

.cont_btn_box a img:hover {
    opacity: 0.8;
}

/*=======================================================================
	SP footer
========================================================================*/

footer .footer_inner small {
    font-size: 3vw;
}

}/* --↑720px 以下　終-- */