@charset "utf-8";
/* ver.161117 */

/* Basic Normalize */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border: 0;font-family: inherit;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}
:focus {outline: 0;}
h1,h2,h3,h4,h5,h6{font-weight: normal;}

ol, ul {list-style: none;}
table {border-collapse: separate; border-spacing: 0;}
caption, th, td {font-weight: normal; text-align: left;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img{border: 0;}
img{vertical-align: top;}
figure{margin: 0}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

.clear:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}
.clear {
    min-height: 1px;
}
* html .clear {
    height: 1px;
    /*\*//*/
    height: auto;
    overflow: hidden;
    /**/
}

/* Basic Config */
html
{
    font-size: 100%;
    background: #fff;
}
body
{
    font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
    color: #000;
    text-align: center;
    width:100%;
    overflow:hidden;
}
body,input,select,textarea
{
    font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif;
    color: #000;
/*    font-size: 1em;
*/    line-height: 40px;
}
html{font-size:62.5%;}
body{font-size:14px; font-size:1.4em;}

button
{
    border: 0;
    outline: 0;
    background: transparent;
}
::selection     {background: #ffcccc; color: red;} /* Safari */
::-moz-selection{background: #ffcccc; color: red;} /* Firefox */

/* Grid Width */
.w960 {width:960px;}
.w720 {width:720px;}
.w640 {width:640px;}
.w580 {width:580px;}
.w560 {width:560px;}
.w480 {width:480px;}
.w420 {width:420px;}
.w400 {width:400px;}
.w390 {width:390px;}
.w320 {width:320px;}
.w240 {width:240px;}
.w220 {width:220px;}
.w160 {width:160px;}
.w120 {width:120px;}
.w100 {width:100px;}
.w90  {width: 90px;}
.w80  {width: 80px;}
.w70  {width: 70px;}
.w60  {width: 60px;}
.w54  {width: 54px;}
.w50  {width: 50px;}
.w40  {width: 40px;}
.w30  {width: 30px;}

/* Grid Height */
.h320 {height:320px;}
.h240 {height:240px;}
.h220 {height:220px;}
.h160 {height:160px;}
.h120 {height:120px;}
.h100 {height:100px;}
.h90  {height: 90px;}
.h80  {height: 80px;}
.h70  {height: 70px;}
.h60  {height: 60px;}
.h54  {height: 54px;}
.h50  {height: 50px;}
.h40  {height: 40px;}
.h30  {height: 30px;}

/* Line Height */
.lh10 {line-height: 10px;}
.lh11 {line-height: 11px;}
.lh12 {line-height: 12px;}
.lh13 {line-height: 13px;}
.lh14 {line-height: 14px;}
.lh15 {line-height: 15px;}
.lh16 {line-height: 16px;}
.lh18 {line-height: 18px;}
.lh20 {line-height: 20px;}
.lh22 {line-height: 22px;}
.lh24 {line-height: 24px;}
.lh26 {line-height: 26px;}
.lh28 {line-height: 28px;}
.lh30 {line-height: 30px;}
.lh32 {line-height: 32px;}
.lh34 {line-height: 34px;}
.lh36 {line-height: 36px;}
.lh38 {line-height: 38px;}
.lh40 {line-height: 40px;}
.lh44 {line-height: 44px;}
.lh48 {line-height: 48px;}
.lh64 {line-height: 64px;}
.lh108{line-height:108px;}


/* Text Color */
.black{color: #000 !important;}
.white{color: #fff !important;}
.red  {color: #f00 !important;}
.gray1{color: #777 !important;}
.gray2{color: #9a9a9a !important;}
.p_blue{color: #015db2 !important;}

/* Background Color */
._black{background-color: #000 !important;}
._white{background-color: #fff !important;}
._red  {background-color: #f00 !important;}
._gray1{background-color: #777 !important;}
._gray2{background-color: #9a9a9a !important;}
._trans{background-color: transparent !important;}


/* Disabled */
.disabled
{
    cursor: default !important;
    pointer-events: none !important;
}

/* =======================================================
        Header
======================================================= */



.header-present1{
    background-image: url(http://www.tfm.co.jp/sky/img2014/body_bg.gif);
    background-repeat: repeat;
    background-position: center top;
   
}

.header-present2{
    display:none;
}


/*PC*/
@media screen and (min-width: 767px)
{

.sp {
    display: none;
}

#main{
   position: relative;
   z-index: 99;
   min-width: 320px;
   background-image: url(http://www.tfm.co.jp/sky/img2014/body_bg.gif);
   background-repeat: repeat;
   background-position: center top;
   margin-right: auto;
   margin-left: auto;
   padding-top:40px;
}

.img1{
   background-color: #fbe4e7;
   background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #FFEFEF), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #FFEFEF),color-stop(.75, #FFEFEF), color-stop(.75, transparent),to(transparent));
   -webkit-background-size: 7px 7px;
     width:850px; 
    margin:0 auto;
    /* border-radius:25px; */
    background-position: center top;
}

.hd{
    width:100%;
}
    
.hd h1{
    width:100%;
    position:relative;
}

.image1{
   width:100%;
}

.tfm{
  position: absolute;
  left: -21%;
  right: 0;
  top: 45px;
  margin: auto;
  width: 22%;
}

.sky{
  position: absolute;
  left: 23%;
  right: 0;
  top: 30px;
  margin: auto;
  width: 17%;
}
   
       
.week{
   width: 100%;
   margin-top: 15px;
   position:relative;
}

.week a{
   width: 40%;
   position:absolute;
   top: 340px;
   left: 245px;
}

.week img{
   width:90%;
   margin-top: 40px;
}

ul.t_btn{
   width:90%;
   margin:0 auto;
   display:table;
   left: 0;
   right: 0;
   top: 420px;
   position: absolute;
}

ul.t_btn li{
   width:50%;
   display:table-cell;
}

ul.touhyo{
   margin: 0 auto;
   width: 100%;
   display:table;
   border-collapse: separate;  /* セルの間隔を空ける */
   border-spacing: 34px 0;  /* 左右 上下で記述 */
}

ul.touhyo li{
   width:50%;
   display:table-cell;
}

ul.touhyo li a {
   width:100%;
}

ul.touhyo li a img{
   margin-top: 55px;
   width: 100%;
}

ul.free{
   margin: 0 auto;
   width: 100%;
   display:table;
}

ul.free li{
   width:50%;
   display:table-cell;
   position:rerative;
}

ul.free li a {
   width:100%;
}



ul.free li a img{
   margin-top:30px;
}

ul.free2{
   margin: 0 auto;
   width: 100%;
   display:table;
}

ul.free2{
   margin: 0 auto;
   width: 100%;
   display:table;
}

ul.free2 li{
   width:50%;
   display:table-cell;
   position:rerative;
}

ul.free2 li a {
   width:100%;
}

ul.free2 li a img{
   margin-top:30px;
}
    
ul.select{
    width:100%;
    display:table;
}

ul.select li{
   width:50%;
   display:table-cell;
}

.radiko{
   margin-top:20px;
}



.twitter2{
   width:100%;
   display:table;
   margin: 40px auto;
   border-collapse: separate;
   border-spacing: 20px 0;
}

.twitter_s{
   display:none;
}

.reibun{
   padding-top:20px;
   /*0226*/
   width:50%;
}

.photo{
   padding-top:20px;
}

.left{
   width:50%;
   display:table-cell;
   vertical-align:top;
}

.right{
  width:50%;
  display:table-cell;
}

.kotoba{
   width:100%;
   margin-top:50px;
}

.kotoba img{
	width:68%
}

.res{
   margin-top:30px;
}

.res img{
   padding-top:10px;
}

ul.sns{
   margin-top:35px;
   width:100%;
   display:table;
}

ul.sns li{
   width:50%;
   display:table-cell;
}

ul.sns li a {
   width:100%;
}

ul.sns li a img{
   width:80%;
}

.gidai{
   width:100%
   margin-top:45px;
   padding-bottom:55px;
   /*0226*/
   margin-top:-40px;
   position: relative;
}

.gi{
   margin-top:70px;
}

.epi{
   margin-top:25px;
}

.timefree_btn1 {
   position: absolute;
   left: 75px;
   /* right: 479px; */
   top: 45%;
   margin: auto;
   width: 271px;
}

.timefree_btn2 {
    position: absolute;
    /* left: 450px; */
    right: 80px;
    top: 45%;
    margin: auto;
    width: 271px;
}

.timefree_btn3 {
    position: absolute;
    left: 75px;
    /* right: 433px; */
    top: 81.3%;
    margin: auto;
    width: 271px;
}


.timefree_btn4 {
	position: absolute;
	/* left: 3px; */
	right: 80px;
	top: 81.3%;
	margin: auto;
	width: 271px;
}
}
/*----------------------- small setting -----------------------*/
@media screen and (max-width: 767px)
{
.view-l-show
{
    /* display: none; */
}
.view-m-show
{
    display: none;
}
.view-s-show
{
    display: inherit;
}

/*----- SP common -----*/
html
{
    font-size: 75%;
    overflow-x: hidden;
}

body
{
    background-size:8%;
}

/*----- SP header -----*/
/*#main img
{
    width: 100%;
}

/*----- SP footer -----*/
#footer
{
    margin-top: 30px;
}

#footer .copyright
{
    padding-right: 0.5em;
    font-size: 0.78em;
}

/*----- SP summary -----*/
.dashed-box .txt
{
    padding: 15px 10px;
    font-size: 75%;
}

      .sns img {
        width:45%;
    }
}

/*SP*/
@media screen and (max-width: 767px)
{
    
#main
{
    position: relative;
    z-index: 99;
    min-width: 320px;
    background-image: url(http://www.tfm.co.jp/sky/img2014/body_bg.gif);
    background-repeat: repeat;
    background-position: center top;
    margin-right: auto;
    margin-left: auto;
    padding-top:20px;
}
        
    
.img1{
   background-color: #fbe4e7;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #FFEFEF), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #FFEFEF),color-stop(.75, #FFEFEF), color-stop(.75, transparent),to(transparent));
-webkit-background-size: 7px 7px;
}
   
.hd{
   position: relative;
   width:100%;
}

.tfm{
    position: absolute;
    left: -30%;
    right: 0;
    top: 3%;
    margin: auto;
    width:30%;
}

.sky{
    position: absolute;
    left: 39%;
    right: 0;
    top: 1%;
    margin: auto;
    width: 25%;
}

.image1{
   width:100%;
}

.hd h1 img{
   margin-top:-20px;
}

.ribon{
   width:100%;
}

.ribon img{
   width:100%;
}

.week{
   position: relative;
   width: 100%;
   margin-top: -10px;
}

.tt{
   width:100%;
}

.week a{
   position:absolute;
   top: 83%;
   left: 31%;
   width: 40%;
}

.week img{
   width:90%;
}

ul.t_btn{
   width:90%;
   margin:0 auto;
   display:table;
   left: 0;
   right: 0;
   top:80%;
   position: absolute;
}

ul.t_btn li{
   width:50%;
   display:table-cell;

}

.radiko{
   width: 100%;
   margin-top:20px;
}

.radiko img{
   width:75%;
}
    
ul.select{
   width:100%;
   display:table;
}

ul.select li{
   width:50%;
   display:table-cell;
}

ul.select li img{
   width:90%;
}

.touhyo{
   margin-top: 0px;
   width:100%;
}

.touhyo img{
   margin-top: 30px;
   width: 75%;
}

.kotoba{
   width:100%;
   margin-top: -11px;
}

.kotoba img{
   width: 95%;
   margin-top: 30px;
}

.twitter{
   margin-top:20px;
   width:100%;
}

.twitter img{
   width:100%;
}

.twitter{
   display:none;
}

.twitter_s{
   width:100%;
}
.twitter_s img{
  width: 100%;
  margin: 0px auto 10px auto;
}

.twitter2{
   width:90%;margin: 30px auto;
}

.bun{
   width:90%;
   margin-top:15px;
}

.photo{
   width:85%;
   margin-top:15px;
}

.reibun{
   width:60%;
   margin:25px 0;
}

.res{
   width:100%;
   margin-top:30px;
}

.res img{
   width:90%;
   padding-top:10px;
}

ul.sns{
   margin-top:35px;
   width:100%;
   display:table;
}

ul.sns li{
   width:50%;
   display:table-cell;
}

ul.sns li img{
   width:90%;
}

.gidai{
   width: 100%;
   padding-bottom:30px;
   margin-top: -20px;
   /*0226 margin-top:30px;*/
}

.gida{
   position: relative;

}

.gi{
   margin: 30px 0 0px 0;
   width:90%;
}


.qiz{
   width:100%;
   margin-top:40px;
   position:relative;
}


.free li:last-child {
  margin-top:-30px;
}
ul.free2{
    margin-top:-30px;
}


.free2 li:last-child {
  margin-top:-30px;
}

.epi{
   width: 85%;
   margin-top: 21px;
   /* margin-bottom:40px; */
}

.kikaku{
   width:95%;  
}

.pre{
    width:52%;
    position: absolute;
    left: 1%;
    right: 0%;
    top: 78%;
    margin: auto;
}

.pre{
    width:52%;
    position: absolute;
    left: 1%;
    right: 0%;
    top: 78%;
    margin: auto;
}

.timefree_btn1 {
    width: 68%;
    /*  position: absolute;
    left: 0;
    right: 0%;
    top: 48%;*/
    margin: -15% auto;
}

.timefree_btn2 {
     width: 68%;
     /*	position: absolute;*/
     margin: -15% auto;
}

.timefree_btn3 {
     width: 68%;
     /*	position: absolute;*/
     margin: -13% auto;
}

.timefree_btn4 {
     width: 68%;
/*	position: absolute;*/
 margin:-15% auto;
}

.header-present1{
    display:none;
}

.header-present2{
    display:inline;
}
}