@charset "utf-8";

/* 
.dividingLine内の.gridBoxに区切り線を付ける 

//補足//
・1～5カラム対応
縦横2カラム以上で利用する場合、最終段でカラム数が端数の場合、枠が欠ける場合があります。
必要であれば空のブロック追加して端数が出ないようにしてご利用ください。

*/

.dividingLine > .gridBox {margin: 0 -5%;}
.dividingLine > .gridBox .grid { 
border-right: 1px dotted #d5d5d5; 
border-top: 1px dotted #d5d5d5; 
padding: 2% 5%;
margin-bottom: 0;
}

@media screen and (max-width: 640px) { /* SP */
.dividingLine > .gridBox .grid{ padding-top: 5%; }
.dividingLine > .gridBox{ padding: 0;}
.dividingLine > .gridBox.sp-1 .grid:nth-of-type(1n) { border-right: 0; }
.dividingLine > .gridBox.sp-1 .grid:first-child { border-top: none; margin-top: -5%; }
.dividingLine > .gridBox.sp-1 .grid:last-child { margin-bottom: -5%; }

.dividingLine > .gridBox.sp-2 .grid:nth-of-type(2n) { border-right: 0; }
.dividingLine > .gridBox.sp-2 .grid:first-child,.dividingLine > .gridBox.sp-2 .grid:nth-child(2) { border-top: none; margin: 0 auto; }
.dividingLine > .gridBox.sp-3 .grid:nth-of-type(3n) { border-right: 0; }
.dividingLine > .gridBox.sp-3 .grid:first-child,.dividingLine > .gridBox.sp-3 .grid:nth-child(2),.dividingLine > .gridBox.sp-3 .grid:nth-child(3) { border-top: none; margin: 0 auto; }
.dividingLine > .gridBox.sp-4 .grid:nth-of-type(4n) { border-right: 0; }
.dividingLine > .gridBox.sp-4 .grid:first-child,.dividingLine > .gridBox.sp-4 .grid:nth-child(2),.dividingLine > .gridBox.sp-4 .grid:nth-child(3) ,.dividingLine > .gridBox.sp-4 .grid:nth-child(4){ border-top: none; margin: 0 auto; }
.dividingLine > .gridBox.sp-5 .grid:nth-of-type(5n) { border-right: 0; }
.dividingLine > .gridBox.sp-5 .grid:first-child,.dividingLine > .gridBox.sp-5 .grid:nth-child(2),.dividingLine > .gridBox.sp-5 .grid:nth-child(3) ,.dividingLine > .gridBox.sp-5 .grid:nth-child(4) ,.dividingLine > .gridBox.sp-5 .grid:nth-child(5){ border-top: none; margin: 0 auto; }}

@media screen and (min-width: 640px) {/* PC */
.dividingLine > .gridBox.pc-1 .grid:nth-of-type(1n) { border-right: 0; }
.dividingLine > .gridBox.pc-1 .grid:first-child { border-top: none; margin: 0 auto; }
.dividingLine > .gridBox.pc-2 .grid:nth-of-type(2n) { border-right: 0; }
.dividingLine > .gridBox.pc-2 .grid:first-child,.dividingLine > .gridBox.pc-2 .grid:nth-child(2) { border-top: none; margin: 0 auto; }
.dividingLine > .gridBox.pc-3 .grid:nth-of-type(3n) { border-right: 0; }
.dividingLine > .gridBox.pc-3 .grid:first-child,.dividingLine > .gridBox.pc-3 .grid:nth-child(2),.dividingLine > .gridBox.pc-3 .grid:nth-child(3) { border-top: none; margin: 0 auto; }
.dividingLine > .gridBox.pc-4 .grid:nth-of-type(4n) { border-right: 0; }
.dividingLine > .gridBox.pc-4 .grid:first-child,.dividingLine > .gridBox.pc-4 .grid:nth-child(2),.dividingLine > .gridBox.pc-4 .grid:nth-child(3) ,.dividingLine > .gridBox.pc-4 .grid:nth-child(4){ border-top: none; margin: 0 auto; }
.dividingLine > .gridBox.pc-5 .grid:nth-of-type(5n) { border-right: 0; }
.dividingLine > .gridBox.pc-5 .grid:first-child,.dividingLine > .gridBox.pc-5 .grid:nth-child(2),.dividingLine > .gridBox.pc-5 .grid:nth-child(3) ,.dividingLine > .gridBox.pc-5 .grid:nth-child(4) ,.dividingLine > .gridBox.pc-5 .grid:nth-child(5){ border-top: none; margin: 0 auto; }}