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

/*********************************************************************
*
* Copyright (c) CUBIC DESIGN INC.
*
* Url : http://www.cubicdesign.co.jp
*
* Built       : 2016/11/25
* Last update : 2016/12/27
* Made by     : Murata Hiroyuki
* Updated by  : Murata Hiroyuki
*
**********************************************************************/


/*************************************************************************************************************************
* reset
*************************************************************************************************************************/
html{ height:100%; overflow-y:scroll; }
body{ height:100%; margin:0; padding:0; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;  word-break:break-all; -webkit-text-size-adjust:100%; text-align:justify; text-justify:inter-ideograph;}
img{ width:100%; max-width:100%; height:auto; border:0; font-size:0; line-height:0; vertical-align:bottom; }
form{ margin:0; padding:0; }
p{ margin:0; padding:0; }
a, a:hover{ text-decoration:none; outline:none; }
h1, h2, h3, h4, h5, h6{ margin:0; padding:0; font-size:0; line-height:0; }
ul, dl, dt, dd{ margin:0; padding:0; }
li, ol{ margin:0; padding:0; list-style:none; }
table{ border:0; border-collapse:collapse; border-spacing:0; }
caption, th{ text-align:left; }
.clear{ clear:both; margin:0; padding:0; font-size:0; line-height:0; }
sup{ font-size:60%; }
header, nav, article, aside, section, footer{ display:block; }
*{ box-sizing:border-box; }



/*************************************************************************************************************************
* デフォルト：640px以下用の記述
*************************************************************************************************************************/

.wrap{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#dfe7e3+0,f2e8e9+52,e9b5c0+100 */
background: #dfe7e3; /* Old browsers */
background: -moz-linear-gradient(top,  #dfe7e3 0%, #f2e8e9 52%, #e9b5c0 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #dfe7e3 0%,#f2e8e9 52%,#e9b5c0 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #dfe7e3 0%,#f2e8e9 52%,#e9b5c0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dfe7e3', endColorstr='#e9b5c0',GradientType=0 ); /* IE6-9 */
}

header{ padding:30px 0 0;}


h1{ width:80%; max-width: 534px; min-width:280px; margin:0 auto; }

.contents{ padding:50px 20px;}

.facebook{ width:100%; height:500px; overflow:hidden;}
.facebook fb-page{ width:100% !important;}

.ggCal{ width:100%; margin:50px 0 0;}
.ggCal iframe{ width:100% !important; height:500px !important;}

footer dl{ padding:0 20px;}
footer dl dt{ width:236px; margin:0 auto;}
footer dl dd{ display:table; margin:15px auto 0; padding:10px 3px 0; border-top:2px solid #e60012; font-size:14px; line-height:1.6;}
footer dl dd a{ color:#00609C;}
footer p{ background: #17458f; margin:30px 0 0; padding:10px; font-family:Arial, Helvetica, sans-serif; font-size: 12px; color: #fff; line-height: 1; text-align: center;}



@media print, screen and (min-width:380px){
  
  .brSP02{ display:none;}
  
}



@media print, screen and (min-width:420px){
  
  .brSP{ display:none;}
  
}



/*************************************************************************************************************************
* 540px以上用の記述
*************************************************************************************************************************/
@media print, screen and (min-width:540px){
  
  .facebook{ width:500px; margin:0 auto;}
  .ggCal{ width:500px; margin:50px auto 0;}
  
}




/*************************************************************************************************************************
* 940px以上用の記述
*************************************************************************************************************************/
@media print, screen and (min-width:940px){
  
  .brSPTB{ display:none;}
  
  .contents{ width:940px; margin:0 auto; padding:100px 20px; overflow:hidden;}
  
  .facebook{ width:430px; height:700px; margin:0; float:left;}

  .ggCal{ width:430px; margin:0; float:right;}
  .ggCal iframe{ height:700px !important;}
  
  footer dl{ display:table; margin:0 auto; padding:0;}
  footer dl dt{ display:table-cell; width:256px; margin:0; padding:0 20px 0 0; vertical-align:middle;}
  footer dl dd{ display:table-ce; margin:0; padding:0 0 0 20px; border-top:none; border-left:2px solid #e60012;}
  
}



/*************************************************************************************************************************
* 1120px以上用の記述
*************************************************************************************************************************/
@media print, screen and (min-width:1120px){
  
  .contents{ width:1120px;}
  
  .facebook{ width:500px;}
  .ggCal{ width:500px;}
  
  footer dl dd a:hover{ text-decoration:underline;}
  
}