@charset "utf-8";
@media screen and (min-width:768px) { 
body{background-image: url("bg_00.jpg");background-attachment: fixed;background-size: cover;background-position: center;
font-family: 'Noto Sans JP', sans-serif;font-size: 100%;}

/*SNSボタン*/
#sns_box{position: fixed;width: 60px;bottom: 20px;right: 20px;z-index: 100;}
#sns_box img{width: 40px;margin: 10px;}

/*レイアウト調整*/
#box{display:flex;justify-content: center;align-items: center;text-align: center;background-image: url("bg_01_anime.png");background-position: center;background-repeat:repeat-y;background-size: 100% auto;}
main{width: 800px;padding: 100px 30px; background-color: rgba(0,0,0,0.5);}
#contents{clear: both;color: #fff;display:table-cell;width: 740px;padding-bottom: 50px;}
#comment{font-size: 25px;margin: 100px 0;}
#contents h2{clear: both;padding-top: 60px;margin-top:-60px;}
#contents h3{padding: 20px 0 20px 0;clear: both}
#contents dl{}
#contents dt{color:#FFF;background-color: #333;padding: 5px;width: 740px}
#contents dd{padding: 5px;margin-bottom: 10px}
p{margin: 10px 0;line-height: 120%;font-size: 100%}
hr{margin: 100px 0;border: 0}

/*画像レイアウト*/
#img {display: flex; width: 740px;}
#img dl{margin-right: auto;margin-left: auto; float: left;}
#img dt{background-color:transparent;padding:0;margin: 10px; width: 100%;text-align: center}
#img dd{margin-bottom: 10px;text-align: center; width: 100%}

/*TOP文字装飾*/
.logo_1{font-size: 70px; line-height: 110%;}
.logo_2{font-size: 63px; line-height: 110%;}
.logo_3{font-size: 30px; line-height: 110%;}
.logo_4{font-size: 48px; line-height: 110%;}

/*文字レイアウト*/
.example{list-style: none;padding-left: 1.5em;margin-left: 0.5em;text-align: left}
.example li{text-indent: -1.5em;}
.example li:before{content: "※";margin-right: 0.5em;}

/*ボタン装飾*/
a#mob{display: block;text-align: center;vertical-align: middle;text-decoration: none;float: left; width: 355px;padding:10px ;background:#333;color: #fff;border-radius: 0;margin: 10px;border: 2px solid #27acd9;border-radius: 1vh;}
a#mob:hover {background: #ccc;color: #000;}

a#mob_end{display: block;text-align: center;vertical-align: middle;text-decoration: none;float: left; width: 355px;padding:10px ;background:#333;color: #ccc;border-radius: 0;margin: 10px;border: 2px solid #6A0E0F;border-radius: 1vh;}
a#mob_end:hover {background: #ccc;color: #000;}

a#totop{display: block;text-align: center;vertical-align: middle;text-decoration: none;	width: 100%;padding:10px ;background:#999;color: #fff;border-radius: 0;margin: 100px 0}
a#totop:hover {background: #ccc;color: #000;}

button {display: block;text-align: center;vertical-align: middle;text-decoration: none;	width: 100%;margin: 10px 0px;padding: 1rem 4rem;border: 2px solid #27acd9;background: #27acd9;border-radius: 1vh;}
button:hover {color: #000;background: #ccc;}
}
/*768px以下は現在地表示のテキストを非表示*/
@media screen and (max-width:768px) { 
body{font-family: 'Noto Sans JP', sans-serif;font-size: 90%;}
body:before{content: "";display: block;position: fixed;top: 0;left: 0;z-index: -2;width: 100%;height: 100vh;background: url("bg_00.jpg") center no-repeat;background-size: cover;}
/*SNSボタン*/
#sns_box{position: fixed;width: 100%;text-align: center; top: 0px;right: 10px;z-index: 100;background-color: rgba(0,0,0,0.5);}
#sns_box img{width: 10%;margin: 10px 5%;}

/*レイアウト調整*/
#box{display:flex;justify-content: center;align-items: center;text-align: center;background-image: url("bg_01_anime.png");background-position: center;background-repeat:repeat-y;background-size: 100% auto;}
main{background-color: rgba(0,0,0,0.5);width: 90%;}

#contents{clear: both;color: #fff;display:table-cell;padding: 80px 0;}
#comment{margin: 80px 10px;text-align: left}
#comment br {display: none;}
#contents h2{font-size: 120%; clear: both;padding-top: 80px;margin-top:-80px;}
#contents h3{padding: 20px 0 20px 0;clear: both}
#contents dl{}
#contents dt{color:#FFF;background-color: #333;padding: 5px;}
#contents dd{padding: 5px;margin-bottom: 10px;text-align: center}
p{margin: 10px 0;line-height: 120%;text-align: left}
hr{margin: 100px 0;border: 0}

/*画像レイアウト*/
#img {}
#img dl{}
#img dt{background-color:transparent;padding:0;margin: 10px; width: 100%;text-align: center}
#img dd{margin-bottom: 10px;text-align: center; width: 100%}

/*TOP文字装飾*/
.logo_1{font-size: 32px; line-height: 110%;text-align: center}
.logo_2{font-size: 29px; line-height: 110%;text-align: center}
.logo_3{font-size: 18px; line-height: 110%;text-align: center}
.logo_4{font-size: 22px; line-height: 110%;text-align: center}

/*文字レイアウト*/
.example{list-style: none;padding-left: 1.5em;margin-left: 0.5em;text-align: left}
.example li{text-indent: -1.5em;}
.example li:before{content: "※";margin-right: 0.5em;}

/*ボタン装飾*/
a#mob{display: block;text-align: center;vertical-align: middle;text-decoration: none;float: left; width: 90%;padding:10px ;background:#333;color: #fff;border-radius: 0;margin: 1% 5% ;border: 2px solid #27acd9;border-radius: 1vh;}
a#mob:hover {background: #ccc;color: #000;}

a#mob_end{display: block;text-align: center;vertical-align: middle;text-decoration: none;float: left; width: 90%;padding:10px ;background:#333;color: #ccc;border-radius: 0;margin: 1% 5%;border: 2px solid #6A0E0F;border-radius: 1vh;}
a#mob_end:hover {background: #ccc;color: #000;}

a#totop{display: block;text-align: center;vertical-align: middle;text-decoration: none;	width: 100%;padding:10px ;background:#999;color: #fff;border-radius: 0;margin: 100px 0}
a#totop:hover {background: #ccc;color: #000;}

button {display: block;text-align: center;vertical-align: middle;text-decoration: none;	width: 94%;margin: 20px 3%;padding: 1rem 2rem;border: 2px solid #27acd9;background: #27acd9;border-radius: 1vh;}
button:hover {color: #000;background: #ccc;}
}