/*
 * Author: Carlos Alvarez
 * URL: http://Alvarez.is
 *
 * Project Name: NYC Design
 * Version: 1.0
 * Date: 04-20-2014
 * URL: 
 */


/* ==========================================================================
   Base Styles, Bootstrap Modifications & Fonts Import
   ========================================================================== */


@import url('redactor.css');


html,
button,
input,
select,
textarea {
    color: #222;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #f2c2c9;
    color: #a4003a;
    text-shadow: none;
}

::selection {
    background: #16a085;
    color: #a4003a;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

 hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

.centered {
	text-align: center
}

img.fit{
	 width:100%;
	 height: auto;
}

ul{
	list-style-type: none;
	padding: 0;
	}
ol{
	padding-left: 2em;}


/* ==========================================================================
   General styles
   ========================================================================== */

html,
body {
    height: 100%;
}

body {
    font-weight: 400;
    font-size: 16px;
    color: #000;

    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touch;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: 300;
}


/* Push the body after clicking the menu button */
.body-push {
	overflow-x: hidden;
	position: relative;
	left: 0;
}

.body-push-toright {
	left: 200px;
}

.body-push-toleft {
	left: -200px;
}

.menu,
.body-push {
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
		-ms-transition: all .3s ease;
		 -o-transition: all .3s ease;
			transition: all .3s ease;
}

#menuToggle {
	position: absolute;
	top: 70px;
	left: 2px;
	z-index: 11;
	display: block;
	text-align: center;
	font-size: 14px;
	color: #ffffff;
	width: 40px;
	height: 40px;
	line-height: 40px;
	cursor: pointer;
	background: rgba(0,0,0,0.25);
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}

#menuToggle:hover {
	color: #ffffff;
	background: rgba(0,0,0,0.2);
	-webkit-transition: all .1s ease-in-out;
	   -moz-transition: all .1s ease-in-out;
		-ms-transition: all .1s ease-in-out;
		 -o-transition: all .1s ease-in-out;
			transition: all .1s ease-in-out;
}


/* ==========================================================================
   Wrap Sections
   ========================================================================== */

#headerwrap {
	margin-top: 0px;
	padding-top:120px;
	text-align:center;
	background-attachment: relative;
	background-position: center center;
	min-height: 700px;
	width: 100%;
	
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

#headerwrap h1 {
	color: #ffffff;
	margin-top: 90px;
	padding-bottom: 30px;
	letter-spacing: 8px;
	font-size: 60px;
	font-weight: bold;
	text-shadow: 2px 2px 2px #000;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;	
}


h1 span{
	font-size: 80%;}

/* About Wrap & Conf */
#aboutwrap {
	margin-top: 80px;
	margin-bottom: 80px;
	background-color: #666666;
	color: #FFF;
}


.name {
	text-align: center;
	background-color: #F45700;
}
.name p {
	font-size: 22px;
	font-weight: lighter;
	margin-top: 15px;
	letter-spacing: 2px;
}

.name-label {
	width: 60px;
	height: 60px;
	margin: 0 auto 45px;
	border-top: 1px solid #000;
	background: url(../img/name-label.png) center bottom no-repeat;
	background-size: 35px 35px;
}

.name-zig {
	width: 73px;
	height: 17px;
	margin: 38px 0 38px;
	background: url(../img/name-zig.png) 0 0 no-repeat;
	background-size: 73px 17px;
}

.name-desc h2 {
	font-family: 'Oswald', sans-serif;
	font-size: 40px;
	line-height: 1.45;
	font-weight: 300;
}




/* Portfolio Wrap Section */
#portfoliowrap {
	display: block;
	margin-top: 80px;
	margin-bottom: 80px;
}

#portfoliowrap h1 {
	font-weight: 300;
	text-align: center;
	margin-bottom: 50px;
}
.mt {
	margin-top: 50px;
}

.mb {
	margin-bottom: 60px;
}

#portfoliowrap i {
	font-size: 50px;
}

.proc {
	padding-top: 15px;
	padding-bottom: 15px;
	border-bottom: solid 2px transparent;
}

#portfoliowrap .proc:hover {
	background-color: #eee;
	border-bottom: solid 2px #2f2f2f
}



/* Service Wrap */
#servicewrap {
	display: block;
	margin-top: 80px;
	margin-bottom: 80px;
}

#servicewrap h1 {
	font-weight: 300;
	text-align: center;
	margin-bottom: 20px;
}

.service {
	text-align: left;
}

.service small {
	font-size: 12px;
	font-weight: bold
}

.service i {
	float: left;
	margin-right: 15px;
	font-size: 30px;
	vertical-align: middle;
}

.service .text {
	color: #767676
}

/* Testimonials Wrap */
#testimonials {
	display: block;
	margin-top: 80px;
	margin-bottom: 80px;
	background-color: #f3f3f3;
}

/* Contact Wrap */
#contactwrap {
	background-color: #2f2f2f;
	margin-top: 0px;
	padding-top: 25px;
	padding-bottom: 25px;
}

#contactwrap p {
	color: #f2f2f2;
}

#contactwrap small {
	font-size: 13px;
}


#contactwrap label {
	color: #f2f2f2;
	margin-top: 10px;
}


/* Gallery Configuration */
.photo-wrapper {
  display: block;
  position: relative;
  overflow: hidden;
  background-color: #2f2f2f;
  -webkit-transition: background-color 0.4s;
  -moz-transition: background-color 0.4s;
  -o-transition: background-color 0.4s;
  transition: background-color 0.4s;
}
.project .overlay {
  position: absolute;
  text-align: center;
  color: #fff;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 0.4s;
  -moz-transition: opacity 0.4s;
  -o-transition: opacity 0.4s;
  transition: opacity 0.4s;
  
}

.project:hover .photo-wrapper {
  background-color: #2f2f2f;
	background-image:url(../img/zoom.png);
	background-repeat:no-repeat;
	background-position:center;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	position: relative;
}
.project:hover .photo {
  opacity: 10;
  filter: alpha(opacity=4000);
  opacity: 0.1;
  filter: alpha(opacity=40);
}
.project:hover .overlay {
  opacity: 100;
  filter: alpha(opacity=10000);
  opacity: 1;
  filter: alpha(opacity=100);
}

.desc {
	margin-top: 25px;
}



/* ########################
Default setting
 #######################   */


#top{
	height: 50px;}


#main_content{
	margin-top: 25px;
	padding-bottom: 25px;
	line-height: 1.8em;
	}
 @media screen and (max-width: 992px) {
	#main_content{
		margin-top: 5px;
		}
    }

.sm-padding{
	padding-left: 5px;
	padding-right: 5px;
	}
.no-padding{
	padding: 0px;
	}
.sm-margin{
	margin-left: 5px;
	margin-right: 5px;
	}
.no-margin{
	margin: 0px;
	}


.mg-bottom{
	margin-bottom: 25px;}
.mg-top{
	margin-top: 25px;}
	


#main_content img{
	max-width: 100%;
	max-height: auto;
    height: auto !important;}

.pull-full{
	margin-bottom: 15px;}

th.normal{
	font-weight: normal;}

.float-right{
	float: right;}

.float-left{
	float: left;}


.alpha{
	margin-bottom: 25px;
	}

.beta_pull{
    left: 7%;
    }

.no_bkg{
    background-color: initial !important;
    background-image: none !important;
    }


/* ########################
Background Color 
 #######################   */
 
 .bg-white{
	 background-color: #FFF;
	 border-radius: 3px;        /* CSS3草案 */  
    -webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 3px;
	 }


/* ########################
SEO 
 #######################   */

#description{
	font-size: 11px;
	margin-top: 10px;
}


/* ########################
Header
 #######################   */
 
 #headInfo{
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% auto;
	margin-bottom: 15px;
	padding-bottom: 10px;
	}


/* ########################
Navigation
 #######################   */


.navbar-nav li{
	text-align: center;
	}

.dropdown-menu li{
	text-align: left !important;
	}

.navbar-brand{
	padding-top: 13px;}

.smart_icons .navbar-brand{
	padding-left: 8px;
	padding-right: 8px;
	font-size: 160%;}

.navbar-brand img{
	max-height: 40px;
	margin-top: -10px;
	width: auto;
	}
.navbar-brand img:hover{
	  filter: alpha(opacity=75);
	  -moz-opacity:0.75;
	  opacity:0.75;
	}

/**/
.navbar-nav li div{
	font-size: 80%;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	}

.navbar-collapse{
    max-height: 100%;
    }



ul .dropdown-menu{
	background-color: #FFF !important;}

.nav-login{
	background-color: #4C4C4C !important;
	color: #FFF !important;}

nav #menuToggle {
	display: none;
}

nav li.social{
	font-size: 120%;
	}

i.fa-angle-right{
	font-size: 180%;
	color:#CCC;
	}

#relatedUrl a:hover > i{
	color: #EAEAEA;
	}

.keywords_inner{
	text-align: center;
	}

.keywords_inner:hover{
	box-shadow: 0px 0px 5px #FFF;
	}

/* ########################
List
 #######################   */

ul > li > ul.list-group{
    margin-top: 5px;
    margin-bottom: 0px;
    }

/*
.list-group-item a{
    width: 100%;
    height: 100%;
    display: block;
    }
*/

ul.list-group ul{
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    }

.post-date{
    font-size: 90%;
    margin-left: 10%;
      filter: alpha(opacity=75);
      -moz-opacity:0.75;
      opacity:0.75;
    }

.side_block div.badge{
    position: absolute;
    top: 15px;
    right: 10px;
    }

.beta .list-group li a:before{
	content: "\f152";
	font-family: FontAwesome;
	right: -15px;
	padding-right: 10px;
     filter: alpha(opacity=35);
    -moz-opacity:0.35;
    opacity:0.35;
	}
 .beta .list-group.li-child li a:before{
     content: '\f054';
     }
    
.childrenList .list-group li a:before{
	content: "\f152";
	font-family: FontAwesome;
	right: -15px;
	padding-right: 10px;
     filter: alpha(opacity=35);
    -moz-opacity:0.35;
    opacity:0.35;
	}


.no-icon li a:before,
.no-icon li:before
{
    content: none !important;
    right: 0px;
    padding-right: 0px;
    }


.main_widget li{
    border-bottom: 1px solid #F2F2F2;
    margin: 5px 0;
    }

/* ########################
TimeLine
 #######################   */
 
.events-body a{
    display: block;
    width: 100%;
    height: 100%;
    }
.events-body .post-categories a{
    float: left;
    width: auto;
    height: auto;
    }


/* ########################
Events
 #######################   */
.archived .thumbnail{
    background-color: #E1E1E1;
    }
.archived .thumbnail a{
      filter: alpha(opacity=75);
  -moz-opacity:0.75;
  opacity:0.75;
    }

/* ########################
Banner
 #######################   */

#banner div{
	margin-bottom: 15px;
	}

#banner div:last-child{
	margin-bottom: 0px;
	}

#banner img{
	width: 100%;
	height: auto;
	}

.side_block {
	margin-bottom: 20px;}

/* ########################
HeadLine H1
 #######################   */
 
#head_line{
	margin-bottom: 35px;}

#sub_line{
	font-size: 70%;
	font-weight: normal !important;
	}

.heading{
	border-left: 5px solid #6AB58D;
	margin-top: 35px;
	padding-left: 15px;
	margin-bottom: 15px;}

div.heading{
	margin-top: 0px;}

/* ########################
Text Style
 #######################   */

.f-sdw{
		text-shadow: 1px 1px 2px #333333;
	}
	
@media screen and (max-width: 786px) {
	
		.rp_block_inner > h1,.rp_block_inner > h2,.rp_block_inner > h3,.rp_block_inner > h4,
		.rp_block_inner p
		{
			text-align: left !important ;}
	}



/* ########################
Key Visual
 #######################   */
#key_visual{
	margin-bottom: 25px;}
	

.carousel-caption{
	top: 40%;
}

.carousel-caption h1{
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif !important ;
	font-size: 48px !important;
	font-weight: bold;
	}

.carousel-block,
.slideContents{
	font-size: 140%;
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
	display: none;
	color: #FFF;
	padding: 60px 30px;
	background-color: rgba(0,0,0,0.45);
	height: 100%;
	}



    
.slideContents{
    background-color: inherit;
    }

.carousel-block h1{
	font-size: 200% !important;
	line-height: 1.4em !important;
	
	}

.slideContents .delay_fade{
    display: none;
    }


.repeat-wrap{
    margin-top: 35px;
    }

.repeat-wrap .col-md-offset-2{
    margin-left: 12%;
    }

@media screen and (max-width: 992px) {
		.carousel-block{
			padding: 10px 10px ;
		}
		.key-block-sm > h1,.key-block-sm > h2,.key-block-sm > h3,.key-block-sm > h4,
		.key-block-sm > p
		{
			text-align: left !important ;}
	}


/* ########################
Separate Visual
 #######################   */
 

/* Separator About - Parallax Section */
.sep {
	background-attachment: fixed;
	background-position: 30% 0;
	background-repeat: no-repeat;
	position: relative;
	
	width: 100%;
	-webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
	
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.sep h1 {
	color: #ffffff;
	margin-top: 120px;
	padding-bottom: 30px;
	letter-spacing: 8px;
	font-size: 60px;
	font-weight: bold;
	text-shadow: 2px 2px 2px #000;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;	
}

/* ########################
Side Block Template
 #######################   */

/*
.beta .fb_iframe_widget{
    margin-left: -7px;
    }
*/

/* ########################
Repeat Block Template
 #######################   */

.rp_block{
	margin-bottom: 30px;}

.rp_block h1{
	margin-bottom: 20px;}

.rp_block .pull-left{
	margin-right: 20px;}

.rp_block .pull-right{
	margin-left: 20px;}

.rp_block_inner ul li:before{
	content: "\f152";
	font-family: FontAwesome;
	right: -15px;
	padding-right: 10px;
	}



/* ########################
Menu Template
 #######################   */

.menu_price{
	font-family: PT Serif, serif;
	font-size: 140%;
	color: #EF7072;
	}

.menu_body{
	font-size: 80%;
	color:#707070;}

.yenMark{
	margin-right: -8px;
	font-size: 70%;}

.inTax{
	font-size: 12px;
	color: #7A7A7A;
	margin-left: 30px;
	}

#menu_cat_list div{
	background-color: #FFF;
	text-align: center;
	border: 1px solid #ECEBEB;
}

#menu_cat_list a{
	color: #4E6347;
	display: block;
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
	}

#menu_cat_list div:hover{
	background-color: #F0F8EC;
}


.menuImage{
    float: left;
    }
    
.img-rounded img{
    border-radius: 4px;        /* CSS3草案 */  
    -webkit-border-radius: 4px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 4px;
    }

/* ########################
Access Template
 #######################   */

.access_flow{
	margin-bottom: 25px;}

#accessTabContent .tab-pane{
	padding: 15px;}

#accessTabContent .flow-block{
	position: relative;}
	
#accessTabContent .flow-block:after{
	content: "\f0da";
	font-family: FontAwesome;
	font-size: 60px;
	position: absolute;
	top: 20%;
	right: -12px;
	color: #A9A9A9;
}

@media screen and (max-width: 992px) {
		#accessTabContent .flow-block:nth-child(3n):after{
		content: " ";
		}
	}

@media screen and (max-width: 768px) {
	#accessTabContent .flow-block:nth-child(3n):after{
		content: "\f0da";
		}
		
		#accessTabContent .flow-block:nth-child(even):after{
		content: " ";
		}
	}



/* ########################
Staff Template
 #######################   */
.panel-innner{
	margin-bottom: 20px;
	padding: 10px;
	border: 1px solid #CCCCCC;}

.panel-innner:hover{
	  filter: alpha(opacity=75);
	  -moz-opacity:0.75;
	  opacity:0.75;
	  background-color: #F8F8F8;
	}



.flow-block,
.flow-block-last{
	margin-bottom: 20px;}

.modal-body{
	padding-bottom: 25px;}

/* ########################
Bottom Template
 #######################   */

footer{
	margin-top: 0px;
	padding-top: 25px;
	padding-bottom: 25px;
	}

#footer_wrap h1,
#footer_wrap h2,
#footer_wrap
{
	color: #FFF;
	font-family: "Lato", sans-serif;
}


#scroll_navi{
	position: fixed;
	right: 15px;
	bottom: 15px;
	width: 46px;
	text-align: center;
	display: none;
	}

#scroll_navi .row{
	margin-left: -15px ;
	margin-right: -15px ;
	}

/* ########################
Table 
 #######################   */
 
 tbody .clickable{
     cursor: pointer;
     }
 

/* ########################
Assets 
 #######################   */
 
#main img{
	height: auto;}

.caption{
	position: relative;
	overflow: hidden;  
	}

.cover{
	background-color: rgba(0,0,0,0.50);
	padding: 20px 10px;
	width: 100%;
	bottom: -60px;
	height: 60px;
	text-align: center;
	position: absolute;
	color: #FFF;
	font-weight: bold;
	}

.caption i{
	margin-right: 7px;}

.image-list{
	margin-bottom: 25px;}

.pull-full img{
	width: 100%;
	height: auto;}


@media screen and (max-width: 992px) {
	.cover{
		bottom: 0 !important;
		}
}

/* ########################
Blog Template
 #######################   */
 
#feed li {
	font-weight: normal;}



#feed i{
	margin-right: 15px;}


.social_counter i{
	margin-right: 5px;}


#multiFeeds dt{
	margin: 0;}

@media screen and (max-width: 320px) {
	.timeline .circ{
		display: none;}
}

/* ########################
Event Template
 #######################   */

.fullFixed{
	color: #CCCCCC;}

#ganma .pricing{
	margin-bottom: 25px;}

form#mailformpro dl dd .full
{
	width: 100%;}

.category-badge a{
    height: auto;}


/* ########################
Bootstrap  Smaller Template
 #######################   */
 
 
 
/* col-sm- */
@media (min-width: 768px) {
  .sm-no-row{
	  margin-right: 0px;
	  margin-left: 0px;
	  }

}

/* col-md- */
@media (min-width: 992px) {
  .sm-no-row{
	  margin-right: -15px;
	  margin-left: -15px;
	  }
}

/* col-lg- */
@media (min-width: 1200px) {
  .sm-no-row{
	  margin-right: -15px;
	  margin-left: -15px;
	  }
}
 
 /* スマホ横画面用 */
@media screen and (max-width: 768px) {
	.body-wrap img{
		width: 100% !important;
		height: auto !important;
		clear: both;
		}
	.body-wrap img:after{
		content: " ";
		clear: both;}
	
	.sep {
	background-size: 100% auto !important;
	width: 100% !important;
	}
	
	#main iframe{
	width: 100% !important;
	height: auto !important;
	}
    
    .row {
        margin-right: 0px;
        margin-left: 0px;
      }
      .sp-row {
            margin-right: -15px;
            margin-left: -15px;
      }

	
	}


/* スマホ横画面用 */
@media screen and (max-width: 480px) {
  .container{padding:0}
  
  h1,
  .h1 {
    font-size: 32px;
  }
  h2,
  .h2 {
    font-size: 28px;
  }
  h3,
  .h3 {
    font-size: 24px;
  }
  h4,
  .h4 {
    font-size: 20px;
  }
  h5,
  .h5 {
    font-size: 14px;
  }
  h6,
  .h6 {
    font-size: 12px;
}
  
   
  html{
	overflow-x : hidden;
	overflow-y : auto;
}
body{
		overflow-x : visible !important;
		}

body{
	background-image: none;
	}


#mfp_phase_stat li{
	width: auto !important;
	border-bottom-style: none !important;
	}

div.mfp_buttons ul li{
	padding-left: 0px;
	}

form#mailformpro dl dt{
	text-align: left !important;
	width: 100% !important;
	float: none !important;
	clear: both !important;
	padding-left: 5px !important;
	border-top: 3px solid #79C174 !important;}

form#mailformpro dl dd{
	float: none !important;
	clear: both !important;
	padding-left: 5px !important;
	margin-bottom: 25px !important;}
	
form#mailformpro dl dd textarea{
	width: 98% !important;}

#caption-sm h2{
	font-size: 100% !important;
	text-align: left;
	line-height: 1.2em;
	}

#scroll_navi{
	right: 5px;
	bottom: 5px;
	}
    
.wp-caption {
    width: 100% !important;
    }
img.size-medium,
img.size-full{
    width: 100%;
    height: auto;
    }

}
/* スマホ縦画面用 */
@media screen and (max-width: 320px) {
  .container{padding:0}
  /*
  div[class^="col-"] {padding:0}
  .row {margin:0;}
  */
  html{
	overflow-x : hidden;
	overflow-y : auto;
	}
 
   h1,
  .h1 {
    font-size: 30px;
  }

}


/* ########################
共通
 #######################   */

body{
	padding-top: 50px;
	}


.block{
	display: block;}

.link-type{
	cursor: pointer}

.middle{
	font-size: 160%;}
.large{
	font-size: 210%;}


hr{
	clear: both;
	border: none;
	}

#block_wp hr{
	margin-bottom: 50px;
}

hr.default-hr{
	border-bottom: 1px solid #CCCCCC;
	margin: 2px;}

hr:after{
	content: " ";
	clear:both;
	}

i{
	margin-right: 5px;}

.li-display ul{
	list-style-type: disc;
	margin-left: 25px;
}

.no-padding{
	padding-left: 0;
	padding-right: 0;}

.padding-right{
	padding-right: 10px;}
.padding-left{
	padding-left: 10px;}

.first{
	margin-top: 0px;}
.last{
	margin-bottom: 0px;}

.clear{
	clear: both;
	}

.heightLine{
    display: none;
    }


.attention{
    color: #E66264;
    font-size: 90%;
    font-weight: bold;
    }

/* ########################
PC SP
 #######################   */ 
.onlySP{ display: none; }
.onlyPC{ display: initial; }
.onlySPbr br{ display: none;}

 @media (max-width: 991px) {
.onlySP{
    display: initial;
    }
.onlyPC{
    display: none;
    }
 .onlySPbr br{
     display: initial;
     }
  
.facebook-box,
.twitter-box,
.line-add{
    float: left;
    margin-left: 3px;
    }
 
 .sp-text-center{ text-align: center;}
 .sp-text-right{ text-align: right;}
 .sp-text-left{ text-align: left;}
 
 .sp-float-left{ float: left;}
 .sp-float-right{ float: right;}
  
 }