﻿@charset "UTF-8";
/***** ESCAPE000 STYLE SHEET *****/

html { margin: 0px; padding: 0px; line-height: 0px; border: 0px; vertical-align: text-bottom; }
body { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background-color: #666; font-family:'Lucida Grande','Hiragino Kaku Gothic ProN',
 Meiryo, sans-serif; color: #000; }

a { text-decoration: none; color: #000; }
a:hover {  }
br { clear:both; }

#bodywrap { width: 980px; height: 1600px; position: absolute; top: 0px; left: 50%; margin-left: -490px; background-color: #000; border-radius: 30px 30px 30px 30px / 20px 20px 20px 20px; }

#section { font-size: 12px; line-height: 26px; }

#nav { width: 980px; height: 60px; position: absolute; top: 0px; left: 50%; margin-left: -490px; opacity: 0.7; background-color: #ffc; border-radius: 30px 30px 0px 0px / 20px 20px 0px 0px; display: block; }
#nav:hover { opacity: 1.0; }
#nav ul { width: 960px; margin: 0px; margin-left: 10px; margin-right: 10px; padding-top: 5px; text-align: center; font-size: 130%; }
#nav li { margin: 8px; float: left; list-style: none; border: 3px solid #333; background-color: #fff; }
#nav li a { width: 76px; height: 24px; background-color: #fff; display: block; text-decoration: none; }
#nav li a:hover { background-color: #ff0; }

#header { width: 980px; height: 190px; position: absolute; top: 54px; left: 50%; margin-left: -490px; background-color: #000; background-image: url('escape-game.png'); }
#header h1 { position: absolute; top: 88px; left: 200px; font-size: 90px; color: #000; letter-spacing: 30px; font-weight: bold; font-family: Arial; }
#header p { width: 960px; position: absolute; top: 110px; left: 150px; font-size: 12px; color: #aaa; }

#article { width: 590px; height: 500px; position: absolute; top: 860px; left: 10px; overflow-x: hidden; overflow-y: auto; margin-left: 10px; background-color: #ffffcc; border-radius: 20px 0px 0px 20px; padding: 10px; }
#article h1 { position: relative; top: 10px; left: 30px; color: #990; border-bottom: 2px solid #990; }
#article p { width: 500px; position: relative; top: 10px; left: 50px; }
#article dl {}
#article dt { padding: 20px; margin-left: 10px; font-size: 20px; }
#article dd {}
#article dd a {}
div.sakuhin { margin-top: 400px; }

#aside04 { width: 640px; position: absolute; top: 740px; left: 0px; padding: 10px; }
#aside04 li { width: 960px; text-align: center; }

#aside05 { width: 350px; position: absolute; top: 860px; left: 640px; text-align: center; }
#aside05 h1 { width: 320px; margin: 10px; background-color: #ccc; color: #000; border-radius: 10px; text-align: center; font-size: 12px; padding: 4px; }
#aside05 p { width: 340px; background-color: #fff; border-radius: 20px; }

div#ct { position: absolute; top: 500px; left: 160px; }


#aside01 { width: 570px; height: 1090px; position: absolute; top: 280px; left: 18px; background-color: #ffcc66; border-radius: 10px; }
#aside02 { width: 350px; height: 1120px; position: absolute; top: 280px; left: 610px; border-radius: 10px; overflow: hidden; }

#aside01 h1 { position: relative; top: 10px; left: 20px; font-size: 18px; margin: 0px; padding: 0px; }
#aside01 dl { width: 540px; height: 640px; position: relative; top: 0px; left: 20px; overflow: auto; }
#aside01 dt { width: 510px; position: relative; top: 0px; left: 0px; padding-left: 10px; background-color: #ff3333; color: #fff; font-weight: bold; margin-top: 20px; border-radius: 10px 10px 0px 0px; }
#aside01 dd { width: 518px; position: relative; top: 0px; left: 0px; margin: 0px; padding: 0px; border: 1px solid #333; border-top: 4px solid #333; border-radius: 0px 0px 10px 10px; }
#aside01 dd img { width: 518px; height: 165px; border-radius: 0px 0px 10px 10px; }
#aside01 dd span { position: absolute; top: 110px; left: 340px; text-shadow: 0px 0px 2px #000; padding: 6px; background: rgba(255,255,255,0.9); border-radius: 8px; display: none; }
#aside01 dd:hover span { display: block; }


#escapeflash { width: 600px; height: 480px; position: absolute; top: 260px; left: 10px; padding: 5px; margin: 5px; border-radius: 10px; background-color: #fff; }
#aside03 { width: 350px; height: 490px; position: absolute; top: 260px; left: 630px; text-align: center; color: #fff; }
#aside03 dl { width: 350px; height: 80px; }
#aside03 dt { width: 320px; padding: 6px; border: 5px solid #333; border-radius: 20px; background-color: #f00; color: #fff; text-align: center; font-size: 16px; }
#aside03 dd { width: 300px; position: relative; top: 8px; left: -28px; padding: 10px; background-color: #fff; color: #000; border: 2px solid #f00; border-radius: 10px; display: none; box-shadow: 4px 4px 2px #333; }
#aside03 dl:hover dd { display: block; }
#aside03 dl:hover dt a { color: #fff; }
#aside03 p { z-index: 999; border: 1px solid #fff; }

img#marks { padding: 10px; margin-top: 10px; }

#footer { width: 960px; position: absolute; top: 1430px; left: 0px; text-align: center; }
#footer p { font-size: 80%; color: #ffff00; margin-right: 20px; }
#footer p a { color: #fff; }

address { width: 940px; position: absolute; top: 1560px; left: 0px; background-color: #99ff00; font-size: 20px; color: #3c3; text-align: right; padding: 10px; padding-top: 20px; padding-right: 30px; border-radius: 0px 0px 30px 30px / 0px 0px 20px 20px; }

@media screen and (max-width: 640px) {

#bodywrap { position: absolute; top: 100px; left: 0px; margin-top: 100px; padding-bottom: 800px; }

}

#articlemail { width: 540px; position: relative; top: 14px; left: 15px; background-color: #ffffcc; border-radius: 20px; margin: 0px; padding: 0px; font-size: 12px; line-height: 1em; }
#articlemail h1 { width: 260px; position: relative; top: 16px; left: 10px; text-align: center; border: 2px solid #ccc; background-color: #990; border-radius: 10px; color: #fff; padding: 6px; font-size: 16px; }

#default_top { position: relative; top: 10px; left: 0px; margin: 0px; padding: 0px; font-size: 12px; color: #000; }
#default_top .main { width: 540px; height: 280px; }
#default_top .title{ display: none; }
#default_top .explain { position: relative; top: 10px; left: 10px; color: #f33; padding: 10px; text-align: left; }

#default_top .name_top { width: 230px; position: absolute; top: 40px; left: 20px; }
#default_top .name_right { text-align: center; }
#default_top .name_parts { width: 230px; padding-top: 6px; color: #000000; background-color: #ffffff; border: 3px double #555555; }

#default_top .mail_top { width: 230px; position: absolute; top: 100px; left: 20px; }
#default_top .mail_right { text-align: center; }
#default_top .mail_parts { width: 230px; padding-top: 6px; color: #000000; background-color: #ffffff; border: 3px double #555555; }

#default_top .url_top { width: 230px; position: absolute; top: 160px; left: 20px; }
#default_top .url_right { text-align: center; }
#default_top .url_parts { width: 230px; padding-top: 6px; color: #000000; background-color: #ffffff; border: 3px double #555555; }

#default_top .textarea_top { width: 240px; position: absolute; top: 50px; left: 270px; }
#default_top .textarea_right { text-align: center; }
#default_top .textarea_parts { width: 240px; height: 200px; line-height: 1.6em; color: #000000; background-color: #ffffff; position: relative; z-index: 99; }

#default_top .submit { text-align: center; font-size: 14px; }
#default_top .submit_button { width: 120px; height: 32px; position: absolute; top: 230px; left: 80px; border: 3px solid #333; border-radius: 10px; color: #000; background-color: #ccc; }

#default_top .error { color: #00ff00; line-height: 1.5em; }
#default_top .error_submit { text-align: center; }
#default_top .error_submit_button { width: 200px; border: 0px; color: #000000; background-color: #ffffff; }
#default_top .result { color: #00ff00; line-height: 1.5em; }
#default_top .result_submit { text-align: center; }
#default_top .result_submit_button { width: 200px; border: 0px; color: #000000; background-color: #ffffff; }
