@charset "UTF-8";

@media print, screen and (min-width: 737px) {
	
	main article {
		
	}
	
	main .philosopy {
		width: 100%;
		background-color: rgba(255,255,255,0.8);
	}
	
	main .philosopy > div {
		min-width: 960px;
		max-width: 1024px;
		margin-left: auto;
		margin-right: auto;
	}
	
	main .philosopy > div > p {
		font-size: 1.7rem;
		line-height: 2.0;
		text-align: center;
		margin-top: 40px;
	}
	
	main .greeting {
		width: 100%;
		background-color: rgba(240,240,240,1.0);
	}
	
	main .greeting > div {
		min-width: 960px;
		max-width: 1024px;
		margin-left: auto;
		margin-right: auto;
	}
	
	main .greeting > div > .column {
		margin-top: 40px;
		background-color: rgba(255,255,255,1.0);
	}
	
	main .greeting > div > .column > div:nth-of-type(1) {
		width: 280px;
	}
	
	main .greeting > div > .column > div:nth-of-type(1) > img {
		width: 280px;
		height: 280px;
	}
	
	main .greeting > div > .column > div:nth-of-type(2) {
		width: 100%;
		max-width: -webkit-calc(100% - 280px);
		max-width: -moz-calc(100% - 280px);
		max-width: -o-calc(100% - 280px);
		max-width: -ms-calc(100% - 280px);
		max-width: calc(100% - 280px);
	}
	
	main .greeting > div > .column > div:nth-of-type(2) > p {
		padding: 24px;
		overflow: hidden;
	}
	
	main .greeting > div > .column > div:nth-of-type(2) > p > span {
		font-size: 1.5rem;
		margin-top: 8px;
		float: right;
		display: block;
	}
	
}

@media only screen and (max-width: 736px) {
	
	main article {
		
	}
	
	main .philosopy {
		width: 100%;
        padding-left: 32px;
        padding-right: 32px;
	}
	
	main .philosopy > div {
        width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	
	main .philosopy > div > p {
		font-size: 1.3rem;
		line-height: 2.0;
		margin-top: 40px;
	}
	
	main .greeting {
        width: 100%;
        padding-left: 32px;
        padding-right: 32px;
		background-color: rgba(240,240,240,1.0);
	}
	
	main .greeting > div {
        width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	
	main .greeting > div > .column {
		margin-top: 40px;
		background-color: rgba(255,255,255,1.0);
	}
	
	main .greeting > div > .column > div:nth-of-type(1) {
        width: 100%;
        float: none;
	}
	
	main .greeting > div > .column > div:nth-of-type(1) > img {
		width: 100%;
		height: auto;
	}
	
	main .greeting > div > .column > div:nth-of-type(2) {
		width: 100%;
        float: none;
	}
	
	main .greeting > div > .column > div:nth-of-type(2) > p {
		padding: 24px;
		overflow: hidden;
	}
	
	main .greeting > div > .column > div:nth-of-type(2) > p > span {
		font-size: 1.5rem;
		margin-top: 8px;
		float: right;
		display: block;
	}
	
}