@charset "utf-8";

/* ----------------------------------
共通
-----------------------------------*/

html,body {
  color: #222;
	background-color: #fff;
  font-size: 100%;
  line-height: 1.7;
  height: 100%;
	font-family:"Noto Sans JP" , "Hiragino Kaku Gothic ProN" , "Hiragino Kaku Gothic Pro" , メイリオ , Meiryo , sans-serif ;
	font-weight: 400;
	margin:0;
	padding:0;
}

html {
	font-size: 62.5%; /* 基本 1rem = 10px */
}

body {
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: unset;
	background: url("../imgs/bg_sp.jpg") no-repeat right top 53px;
	background-size: cover;
}
@media screen and (min-width: 992px) {
	body {
		background: url("../imgs/bg.jpg") no-repeat right top;
		background-size: contain;
	}	
	
	
}


@media only screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
}

@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 400;
}
@-ms-viewport
{
	width: auto !important;
	initial-scale: 1 !important;
}
@viewport
{
	width: device-width;
	initial-scale: 1;
}	

/* clearfix ----------------------------------*/

.cf, .container {
  *zoom: 1;
}
.cf:after, .container:after {
  content: " ";
  display: block;
  visibility: hidden;
  clear: both;
  height: 0;
  line-height: 0;
}

*{
	box-sizing: border-box;
}

a {
  text-decoration: none;
  color: #333;
  transition: color .2s, border .2s;
}
 
a:visited,
a:active {
  color: inherit;
}
a:focus {
  outline: none;
}

img {
  max-width: 100%;
}

/*a img {
	opacity: 1.0;
	filter: alpha(opacity=100);
	transition-duration: 0.2s;
}
a img:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);
}*/

img.responsive {
	max-width: 100%;
	height: auto;
}

.anchorlink{
	margin-top:-80px !important;
	padding-top:80px !important;
	display: block;
}

@media (min-width: 992px) {
	.anchorlink{
		margin-top:-20px !important;
		padding-top:20px !important;
		display: block;
	}
}

.movie-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
 
.movie-container iframe,  
.movie-container object,  
.movie-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

p {
  font-size: 13px;
  line-height: 1.8;
	margin:0;
}

@media screen and (min-width: 576px) {
  p {
    font-size: 13px;
  }
}

@media screen and (min-width: 768px) {
  p {
    font-size: 14px;
  }
}

@media screen and (min-width: 992px) {
  p {
    font-size: 15px;
		line-height: 1.8;
  }
}

@media screen and (min-width: 1200px) {
  p {
    font-size: 16px;
  }
}


section {
  margin:40px 0;
}
section#intro{
	margin-top: 20px;
}
@media screen and (min-width: 576px) {
  section {
    margin:50px 0;
  }
}
@media screen and (min-width: 768px) {
  section {
    margin:60px 0;
  }
}
@media screen and (min-width: 992px) {
  section {
    margin:80px 0;
  }
}
@media screen and (min-width: 1200px) {
  section {
    margin:100px 0;
  }
	section#intro{
		margin-top: 80px;
	}
}





.s-section {
  margin-bottom: 30px;
}
@media screen and (min-width: 576px) {
  .s-section {
    margin-bottom: 30px;
  }
}
@media screen and (min-width: 992px) {
  .s-section {
    margin-bottom: 30px;
  }
}
@media screen and (min-width: 1200px) {
  .s-section {
    margin-bottom: 30px;
  }
}


.circle > li{	list-style:circle !important;}
.disc > li{	list-style: disc !important;}
.number > li{	list-style:decimal !important;}

.circle > li,
.disc > li,
.number > li{
	margin:0 0 0 20px;
	padding:0;
}

@media (min-width: 960px) {
	.circle > li,
	.disc > li,
	.number > li{
		margin:0 0 0 22px;
	}
}

li {
  font-size: 13px;
  line-height: 1.8;
}
@media screen and (min-width: 576px) {
  li {
    font-size: 13px;
  }
}
@media screen and (min-width: 768px) {
  li {
    font-size: 14px;
  }
}
@media screen and (min-width: 992px) {
  li {
    font-size: 15px;
		line-height: 1.8;
  }
}
@media screen and (min-width: 1200px) {
  li {
    font-size: 16px;
  }
}

.text-left{	text-align: left;}
.text-center{	text-align: center;}
.text-right{	text-align: right;}


hr {
	width: 100%;
	margin:0 auto;
	border: 0;
	border-top: transparent solid 1px;
	border-color: #e2e2e2;
}

hr.slash{
	background:url(../imgs/border.gif) repeat-x left top;
	border:0;
	height:5px;
	margin:0;
	padding:0;
	line-height:0;
}

hr.dot{
	padding:0;
	margin:0;
	border:0;
	height:0;
	border-bottom:1px dotted #D5CCC1;
}

hr.solid{
	padding:0;
	margin:0;
	border:0;
	height:0;
	border-bottom:1px solid #D5CCC1;
}


/* display ----------------------------------*/

.display-none-min {
  display: none !important; }

@media screen and (min-width: 576px) {
  .display-none-min-sm {
    display: none !important;
  }
}
@media screen and (min-width: 768px) {
  .display-none-min-md {
    display: none !important;
  }
}
@media screen and (min-width: 992px) {
  .display-none-min-lg {
    display: none !important;
  }
}
@media screen and (min-width: 1200px) {
  .display-none-min-xl {
    display: none !important;
  }
}
.display-none-max {
  display: none !important;
}
@media screen and (max-width: 575px) {
  .display-none-max-sm {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  .display-none-max-md {
    display: none !important;
  }
}
@media screen and (max-width: 991px) {
  .display-none-max-lg {
    display: none !important;
  }
}
@media screen and (max-width: 1199px) {
  .display-none-max-xl {
    display: none !important;
  }
}

/* 
----------------------------------*/

.m0{ margin:0 !important; }
.mb0{ margin-bottom:0 !important; }
.mb5{ margin-bottom:0.5rem !important; }
.mb10{ margin-bottom:1.0rem !important; }
.mb15{ margin-bottom:1.5rem !important; }
.mb20{ margin-bottom:2.0rem !important; }
.mb30{ margin-bottom:3.0rem !important; }
.mb40{ margin-bottom:4.0rem !important; }
.mb50{ margin-bottom:5.0rem !important; }
.mb60{ margin-bottom:6.0rem !important; }

.mt0{ margin-top:0 !important; }
.mt5{ margin-top:0.5rem !important; }
.mt10{ margin-top:1.0rem !important; }
.mt15{ margin-top:1.5rem !important; }
.mt20{ margin-top:2.0rem !important; }
.mt30{ margin-top:3.0rem !important; }
.mt40{ margin-top:4.0rem !important; }
.mt50{ margin-top:5.0rem !important; }
.mt60{ margin-top:6.0rem !important; }

.p0{ padding:0 !important; } 
.pt0{padding-top:0 !important; } 
.pb0{ padding-bottom:0 !important; } 

@media (min-width: 992px) {
	/*pcにしか効かないマージン*/
	.pc_mb0{ margin-bottom:0 !important; }
	.pc_mb5{ margin-bottom:0.5rem !important; }
	.pc_mb10{ margin-bottom:1.0rem !important; }
	.pc_mb15{ margin-bottom:1.5rem !important; }
	.pc_mb20{ margin-bottom:2.0rem !important; }
	.pc_mb30{ margin-bottom:3.0rem !important; }
	.pc_mb40{ margin-bottom:4.0rem !important; }
	.pc_mb50{ margin-bottom:5.0rem !important; }
	
	.pc_mt0{ margin-top:0 !important; }
	.pc_mt5{ margin-top:0.5rem !important; }
	.pc_mt10{ margin-top:1.0rem !important; }
	.pc_mt15{ margin-top:1.5rem !important; }
	.pc_mt20{ margin-top:2.0rem !important; }
	.pc_mt30{ margin-top:3.0rem !important; }
	.pc_mt40{ margin-top:4.0rem !important; }
	.pc_mt50{ margin-top:5.0rem !important; }	
}

@media (max-width: 991px) {
	/*spにしか効かないマージン*/
	.sp_mb0{ margin-bottom:0 !important; }
	.sp_mb5{ margin-bottom:0.5rem !important; }
	.sp_mb10{ margin-bottom:1.0rem !important; }
	.sp_mb15{ margin-bottom:1.5rem !important; }
	.sp_mb20{ margin-bottom:2.0rem !important; }
	.sp_mb30{ margin-bottom:3.0rem !important; }
	.sp_mb40{ margin-bottom:4.0rem !important; }
	.sp_mb50{ margin-bottom:5.0rem !important; }	
	
	.sp_mt0{ margin-top:0 !important; }
	.sp_mt5{ margin-top:0.5rem !important; }
	.sp_mt10{ margin-top:1.0rem !important; }
	.sp_mt15{ margin-top:1.5rem !important; }
	.sp_mt20{ margin-top:2.0rem !important; }
	.sp_mt30{ margin-top:3.0rem !important; }
	.sp_mt40{ margin-top:4.0rem !important; }
	.sp_mt50{ margin-top:5.0rem !important; }
}
