@charset "UTF-8";
/* *********************************************************
本格子供向けタブレット「tap me」公式サイト
File name : style.css
Modified  : 2013-04-24
********************************************************* */
/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::
reset
::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/* YUI 3.5.0 reset.css (http://developer.yahoo.com/yui/3/cssreset/) - http://cssreset.com */
html { color: #000; background: #FFF; overflow-y: scroll; font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","Osaka",sans-serif; }
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset, img { border: 0; vertical-align: bottom; }
address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; }
ol, ul { list-style: none; }
caption, th { text-align: left; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
q:before, q:after { content: ''; }
abbr, acronym { border: 0; font-variant: normal; }
sup { vertical-align: text-top; }
sub { vertical-align: text-bottom; }
input, textarea, select { font-family: inherit; font-size: inherit; font-weight: inherit; }
input, textarea, select { *font-size: 100%; }
legend { color: #000; }
#yui3-css-stamp.cssreset { display: none; }
small { font-size: 100%; }
ul li { list-style: none; }

                                       /*==================================
default
===================================*/
body { overflow: hidden; }
body { -webkit-text-size-adjust: 100%; /*iphone*/ background: #f9f8ef; width: 100%; font-size: 62.5%; line-height: 1.5; font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","Osaka",sans-serif; }

/*==================================
all
===================================*/
#container { background: #fcfcfc url("../images/body_back.jpg") repeat; min-width: 1050px; width: 100%; }
em { font-weight: bold; }
.wrapper h1 { text-indent: 100%; white-space: nowrap; overflow: hidden; background: url(../img/back_sprite.png) no-repeat; width: 376px; margin: 0 auto; height: 71px; background-position: 0 -5px; margin-bottom: 20px; }
.wrapper h2 { color: #06b096; font-size: 1.3em; font-weight: bold; }

/*==================================
allLayout
===================================*/
div.sec-lv1 { margin-bottom: 60px; }
div.sec-lv1 h1 { padding-bottom: 10px; }
div.sec-lv2 { width: 1050px; margin: 0 auto; text-align: center; }
div.sec-lv2 h2 { padding: 60px 0 36px 0; }

/*==================================
.header
===================================*/
.header { background: url("../tapme_images/header_mainimg.jpg") top center no-repeat; }
.header_inner { width: 984px; margin: 0 auto; position: relative; height: 728px; }
.header h1#main_ttl_logo { position: absolute; top: 104px; left: -30px; }
#main_img_omochataisho { position: absolute; top: 104px; left: 357px; }
#sub_nav { position: absolute; top: 194px; right: 10px; }
#sub_nav a:link img { opacity: 1; transition: all 0.5s ease-out 0s; }
#sub_nav a:hover img.m_guide { opacity: 0.8; transition: all 0.2s ease-out 0s; }
#sub_nav a:hover img.s_list { opacity: 0.5; transition: all 0.2s ease-out 0s; }
#sub_nav #area_youtube { padding: 0 0 10px 12px; }
.gNavwrap { z-index: 99; position: fixed; top: 0; width: 100%; background: url("../images/header_back.png") repeat-x; height: 82px; }
.nav { width: 980px; margin: 0 auto; }
.nav ul { padding-top: 16px; }
.nav ul li { float: right; background: url("../images/nav_sprite.png") no-repeat; background-position: 0 0; width: 145px; height: 40px; margin-left: 8px; }
.nav ul li a { display: block; background: url("../images/nav_sprite.png") no-repeat; background-position: 0 0; width: 145px; height: 40px; -webkit-transition: .3s ease-out; -moz-transition: .3s ease-out; -o-transition: .3s ease-out; transition: .3s ease-out; }
.nav ul li a:hover { opacity: 0; /* FireFox, Webkit, Opera */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; /* IE */ filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0); -webkit-transition: .5s ease-out; -moz-transition: .5s ease-out; -o-transition: .5s ease-out; transition: .5s ease-out; }
.nav ul li:first-child, .nav ul li:first-child a { background: none; position: absolute; margin-top: -4px; margin-left: -8px; }
.nav ul li:first-child a:hover { opacity: .7; /* FireFox, Webkit, Opera */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=70)"; /* IE */ filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70); }
.nav ul li:nth-child(2) { background-position: -700px -40px; }
.nav ul li:nth-child(3) { background-position: -595px -40px; width: 100px; }
.nav ul li:nth-child(4) { background-position: -460px -40px; width: 130px; }
.nav ul li:nth-child(5) { background-position: -310px -40px; }
.nav ul li:nth-child(6) { background-position: -155px -40px; }
.nav ul li:nth-child(7) { background-position: 0 -40px; }
.nav ul li:nth-child(2) a { background-position: -700px 0; }
.nav ul li:nth-child(3) a { background-position: -595px 0; width: 100px; }
.nav ul li:nth-child(4) a { background-position: -460px 0; width: 130px; }
.nav ul li:nth-child(5) a { background-position: -310px 0; }
.nav ul li:nth-child(6) a { background-position: -155px 0; }

/*==================================
tampe_menu
===================================*/
#tampe_menu { width: 980px; margin: 10px auto 30px; overflow: hidden; position: relative; }

.btn_acadapter{ width:570px; height:50px; margin-bottom:10px;}
.btn_acadapter a:link img { opacity: 1; transition: all 0.5s ease-out 0s; }
.btn_acadapter a:hover img { opacity: 0.5; transition: all 0.2s ease-out 0s; }

.list_tapme { width: 480px; height: 444px; float: left; position: relative; background: url("../tapme_images/back_tapme.png") no-repeat 0 0; margin-top:10px; margin-right: 20px; margin-bottom:10px; }
.list_tapme img { width: 222px; height: 44px; position: absolute; bottom: 15px; right: 15px; }
.list_tapme a:link img { opacity: 1; transition: all 0.5s ease-out 0s; }
.list_tapme a:hover img { opacity: 0.5; transition: all 0.2s ease-out 0s; }
.list_tapmeplus { width: 480px; height: 444px; float: left; position: relative; background: url("../tapme_images/back_tapmeplus.png") no-repeat 0 0; margin-top:10px; }
.list_tapmeplus img { width: 222px; height: 44px; position: absolute; bottom: 15px; right: 15px; }
.list_tapmeplus a:link img { opacity: 1; transition: all 0.5s ease-out 0s; }
.list_tapmeplus a:hover img { opacity: 0.5; transition: all 0.2s ease-out 0s; }

.appli { width:652px; height:53px; display: block; text-align: left; clear: both; padding-top: 10px; position:relative; background: url("../tapme_images/spec_text.gif") no-repeat 0 0; }
.appli img{ width:144px; height:26px; position:absolute; bottom:8px; right:5px; }
.appli a:link img { opacity: 1; transition: all 0.5s ease-out 0s; }
.appli a:hover img { opacity: 0.5; transition: all 0.2s ease-out 0s; }

/*==================================
updadteinfo
===================================*/
#updadteinfo { width: 960px; margin: 0 auto; color: #797979; overflow: hidden; }
#updadteinfo h1 { width: 92px; height: 74px; text-align: center; color: #FFFFFF; font-size: 13px; font-weight: bold; line-height: 1.2; padding: 20px 16px 0 0; float: left; background: url("../tapme_images/update_bg_month.gif") no-repeat 0 0; margin-right: 10px; }
#updadteinfo h1 span { font-size: 21px; }
#updadteinfo dl { padding-top: 8px; }
#updadteinfo dt { padding-left: 40px; }
#updadteinfo dt p { float: left; }
#updadteinfo dd { float: left; padding-left: 20px; }
#updadteinfo dd h2 { font-size: 21px; font-weight: bold; padding-bottom: 4px; }
#updadteinfo dd h2 span { color: #ea2e3c; }

/*#updadteinfo dd p { font-size:16px; background: url("../tapme_images/update_icon_arrow.gif") no-repeat 0 3px; padding-left:10px}
#updadteinfo dd p a:link{color:#797979; text-decoration:none}
#updadteinfo dd p a:visited{color:#797979; text-decoration:none}
#updadteinfo dd p a:hover{color:#797979; text-decoration: underline}
#updadteinfo dd p a:active{color:#797979; text-decoration:underline}*/
#updadteinfo .btn { color: #FFFFFF; font-weight: bold; font-size: 18px; line-height: 1; }
#updadteinfo .btn a { display: block; padding: 12px 18px 12px 40px; width: 310px; background: url("../images/btn_icon.gif") #33ccff 14px 50% no-repeat; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; }
#updadteinfo .btn a:link { color: #FFFFFF; opacity: 1; transition: all 0.5s ease-out 0s; text-decoration: none; }
#updadteinfo .btn a:hover { color: #FFFFFF; opacity: 0.5; transition: all 0.2s ease-out 0s; }
#updadteinfo .btn a:visited { color: #FFFFFF; opacity: 0.5; transition: all 0.2s ease-out 0s; }

/*==================================
sns
===================================*/
.asideInfo { width: 980px; margin: 0 auto; }
.social { font-size: 1.0em; position: absolute; bottom: 0px; right: 0px; }

/*.social { font-size: 1.0em; position: absolute; top: 90px; }*/
.social li { float: left; margin-left: 0; overflow: hidden; }

/*.social li:first-child { width: 74px; }*/
.social li:nth-child(2) { margin-left: 5px; }

/*==================================
.news
===================================*/
.news { border: 2px solid #48c4ee; width: 946px; margin: 20px auto 20px auto; background: url("../tapme_images/news_subttl.gif") no-repeat 15px center #48c4ee; border-radius: 17px; behavior: url(../js/PIE.htc); position: relative; font-size: 1.2em; color: #616161; }
.news dl { width: 816px; background: #fff; border-radius: 0 17px 17px 0; behavior: url(../js/PIE.htc); position: relative; margin-left: 130px; padding: 11px 0 8px; }
.news dt { float: left; padding: 0 8px 3px 11px; }
.news dd { float: left; padding: 0 8px 3px; width: 700px; }
.news a, .news a img { -webkit-transition: .5s ease-out; -moz-transition: .5s ease-out; -o-transition: .5s ease-out; transition: .5s ease-out; color: #de3549; }
.news a:hover { background: #de3549; color: #fff; text-shadow: none; text-decoration: none; -webkit-transition: .2s ease-out; -moz-transition: .2s ease-out; -o-transition: .2s ease-out; transition: .2s ease-out; }
.news a:hover img { background: transparent; -webkit-transition: .2s ease-out; -moz-transition: .2s ease-out; -o-transition: .2s ease-out; transition: .2s ease-out; }

/*==================================
.tapme_plus
===================================*/
#tapmeplus { width: 980px; margin: 40px auto; position: relative; }
#tapmeplus_box { width: 920px; border: solid 4px #d7067d; -moz-border-radius: 15px; -webkit-border-radius: 15px; position: relative; border-radius: 15px; -ms-border-radius: 15px; behavior: url(../js/PIE.htc); margin: 10px auto; padding: 30px; }
.title_tapmeplus { width: 464px; heigh: 228px; float: left; }
.img_tapmeplus { width: 450px; height: 380px; float: right; margin: -40px 0 -30px 0; }
#app_tapmeplus { width: 920px; border-collapse: separate; border-spacing: 10px; margin: 20px auto; }
#app_tapmeplus td { width: 455px; height: 152px; }
.app_bottom { vertical-align: bottom; }

/*==================================
.sec-about
===================================*/
.sec-about { text-align: center; }
.sec-about h1 { width: 980px; text-align: left; margin: 0 auto; }
.sec-about .aboutImage li { padding-top: 30px; }
.sec-about .aboutImage li:nth-child(3) { padding-top: 0; }
.sec-about .lineup li:first-child { margin-bottom: 30px; }

/*==================================
.movie
===================================*/
.sec-movie { width: 980px; margin: 0 auto; position: relative; padding-bottom: 20px; }
.sec-movie ul { display: block; margin-top: 20px; height: 454px; background: url("../tapme_images/movie_mainback.png") no-repeat center center; }
.sec-movie li { position: absolute; top: 114px; left: 240px; }

/*==================================
.product
===================================*/
.sec-product { width: 980px; margin: 0 auto; position: relative; }
.sec-product li a { position: absolute; left: 517px; top: 210px; display: block; }
.sec-product li:first-child a:hover { opacity: .7; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=70)"; /* IE */ filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70); background: none; }
#mynavnews_btn { padding-bottom: 20px; }
#mynavnews_btn a:link img { opacity: 1; transition: all 0.5s ease-out 0s; }
#mynavnews_btn a:hover img { opacity: 0.5; transition: all 0.2s ease-out 0s; }
#mynavnews_btn a, #mynavnews_btn a img { color: #FFF; background: none; }
#shoplink { margin-top: 50px; margin-bottom: 70px; }
#shoplink a:link img { opacity: 1; transition: all 0.5s ease-out 0s; }
#shoplink a:hover img { opacity: 0.7; transition: all 0.2s ease-out 0s; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)"; }
#shoplink a, #mynavnews_btn a img { color: #FFF; background: none; }

/*==================================
.footer
===================================*/
.footer { background: url("../images/footer_back.png") repeat-x; height: 75px; padding-top: 2px; }
.footer ul { width: 980px; margin: 0 auto; padding-top: 10px; font-size: 1.3em; }
.footer a:hover { background: none; opacity: .7; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=70)"; /* IE */ filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70); }

/*==================================
oocss
===================================*/
.fixed { position: fixed; top: 0; }
.hide-text { text-indent: 100%; white-space: nowrap; overflow: hidden; }
.caution { color: #de3549; }

/* For modern browsers */
.cf:before, .cf:after { content: ""; display: block; overflow: hidden; }
.cf:after { clear: both; }

/* For IE 6/7 (trigger hasLayout) */
.cf { zoom: 1; }

/*==================================
script
===================================*/
.bodyMargin { margin-top: 111px; }