@charset "utf-8";
/* CSS Document */
html {
	font-size: 62.5%; /*16px*62.5%=10px*/
}
body {
	color: #5D4F4C;
	font-family: "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
	font-size: 1.4rem;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-feature-settings: "pkna";
}
img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}

.br-pc {
	display: none;
}
.br-sp {
	display: block;
}
a {
	text-decoration: none;
}


.window__h2{
    padding-left: 5px;
    border-left: 10px solid #25C1C1;
	font-size: 1.8rem;
	font-weight: 900;
	margin-bottom: 20px;
}
.window-first-section{
	width: 100%;
	padding:40px 20px 0px;
	margin: 0 auto 40px;
}
.window__h3{
	font-size: 1.6rem;
	font-weight: 900;
	text-align: center;
	padding: 40px 0;
}
.works-table{
	display: flex;
	flex-wrap: wrap;
	 border: 1px solid #28BCBC;
	 border-top: none;
	margin: 40px 0 20px;
}
.works-table dt{
	width: 30%;
	padding: 10px;
	background: #28BCBC;
	color: #fff;
	font-weight: 900;
	text-align: center;
	border-top: solid 1px #fff;
}
.works-table dt:first-of-type{
	border-top: solid 1px #28BCBC;
}
.works-table dd{
	width: 70%;
	padding: 10px;
	border-top: solid 1px #28BCBC;
	word-break: break-all;
}

.work__btn {
    width: 250px;
    height: 45px;
    background: #28bcbc;
    display: block;
    vertical-align: middle;
    line-height: 45px;
    margin: 0 auto;
    color: #ffffff;
	text-align: center;
}

.window__h3-horizon{
	    display: flex; 
    align-items: center; 
    text-align: center; 
	margin-bottom: 20px;
}

  .window__h3-horizon::before,
  .window__h3-horizon::after{
    content:"";
    flex-grow: 1;  
    border-bottom: 1px solid #28BCBC;
  }

  /* 左側の線 */
  .window__h3-horizon::before{
    margin-right: 2em; 
    padding-left: 15px;  
  }

  /* 右側の線 */
  .window__h3-horizon::after{
    margin-left: 2em; 
    padding-right: 15px;  
  }

.window-second-section{
	padding: 0 20px;
}

.window-second-section p{
	padding: 20px 0;
}




@media screen and (min-width:749px) {
body {
	font-size: 1.6rem;
	
	}
	
	a:hover {
    position: relative;
    top: 1px;
    left: 1px;
	transition: all .3s;
		opacity: 0.8;
}	
	
	
	.window-first-section{
			max-width: 1080px;
		margin: 0 auto;
		padding: 40px 0;
	}
	.works-flex{
		display: flex;
		  align-items: flex-start;

	}
	.works-parts{
		display: block;
		width: 50%;
		margin-right: 40px;
	}
	.works-parts:last-child{
		margin-right: 0;
	}
	
	.window__h2{
		font-size: 2.8rem;
		padding-left:20px;
		margin-bottom:60px
	}
	.window__h3{
		font-size: 2rem;
		padding: 0 0 40px;
	}
	.window-second-section{
		max-width: 1080px;
		margin: 0 auto;
		padding: 40px 0;
	}
	
	.window-second-section__flex{
		display: flex;
		align-items: flex-start;
	}
	
	.window-second-section__flex img{
		width: 50%;
		margin-right: 40px;
	}
	.window-second-section__flex p{
		width: 50%;
	}
}